5

我有一些 AngularJS 的东西，里面有一堆数组和数据。一旦用户上传了一个文件，该文件就会被解析并保存到具有不同数组的作用域中。然而，在所有这些和文件被保存在范围之后，我尝试更新 innerHTML，但 AngularJS 代码不起作用。我曾经ng-repeat根据数组创建一个表格，但它仍然是一个包含内容的单个单元格{{column}}等。

我在使用指令和模板时遇到了极大的困难，因为我的 index.html 说appandmodule等在我执行诸如此类的操作时是未定义的app.directive(...

我的 index.html 文件的重要部分包括：

<html ng-app>
... //once a file is uploaded, total.js is called;
//this was so the app didn't try to run before a file was uploaded
<div id="someStuff">This will become a table once a file is uploaded</div>

这是一个简单的例子，说明我的范围是如何在 total.js 中设置的：

function sheet($rootScope, $parse){
    $rootScope.stuff = text; 
//text is a variable that contains the file's contents as a string
};

document.getElementById('someStuff').innerHTML="<div ng-controller='sheet'>{{stuff}}</div>";

HTML 发生了变化，但不是打印文件的内容，而是只打印{{stuff}}. 我怎样才能让 innerHTML 理解它包含 AngularJS，最好不使用部分或指令，除非你能彻底解释我在哪里输入它以及它的语法。

编辑 1： 我尝试过使用 $compile 但它被标记为未定义。我查看了这个以找出编译问题，但我不明白 rtcherry 的语法，以及我应该如何将它应用到我自己的代码中。

编辑 2： 当我像这样包含它时，我仍然收到 $compile 未定义的错误：

function sheet($rootScope, $parse, $compile){...};
document.getElementById('someStuff').innerHTML=$compile("<div ng-controller='sheet'>
{{stuff}}</div>")(scope);

编辑 3： 虽然 itcouldevenbeaboat 的评论非常无益，但我决定也许应该向您展示我尝试这样做的指导方式。

我将此代码包含在我的工作表函数下：

var app = angular.module('App', []);
app.directive('spreadsheeet', function($compile){
    return{
        templateUrl: innerHTML.html
    }
});

innerHTML 包含的地方<div ng-controller='sheet'>{{stuff}}</div>和 index.html 上我已经包含<div spreadsheet></div>

有了这个，我没有收到任何错误，但文本没有显示，既不是文件内容，也不{{stuff}}是文件内容。即使我做一些简单的事情，例如提供template: "<h2>Hello!</h2>"而不是 a templateUrl，我也无法Hello!打印。

4

2 回答 2

5

这个对我有用

document.getElementById('someStuff').innerHTML = "<div ng-controller='sheet'>{{stuff}}</div>";
$compile( document.getElementById('someStuff') )($scope);
于 2014-10-21T23:33:31.927 回答
0

简单的解决方案（它将 100% 工作）：

在控制器中，不要忘记在控制器中注入 $document作为依赖项，如下所示：

App.controller('indiaController', function ($scope, $document,$filter, $location) {

    var text_element = angular.element($document[0].querySelector('#delhi');
    text_element.html('your dynamic html placed here');
}
于 2018-02-05T18:18:12.993 回答