问题标签 [angularjs-interpolate]

我需要在模板中使用嵌入式脚本，但在脚本运行之前动态插入图像路径。

我编写了一个指令来将图像路径构建为范围变量，然后用于$interpolate将其插入到<script>标签中。

现在存储的引用（作为字符串）$scope.tag是我希望像脚本标签一样注入和解释/运行的代码。

然而，脚本标签作为字符串添加到我的模板中，我似乎无法确定需要采取哪些额外步骤才能将脚本标签字符串实际输出为脚本标签。

这是模板（在指令中称为templateUrl）：

指示：

作为参考，此时$scope.tag变量将包含以下字符串：

有没有办法防止对 div 进行插值？我想从中获取原始 html 并通过$interpolate像这样注入手动插值：

I get an interpolation error but only sometimes. I refresh/load page a few hundred times without error or sometimes on first load it appears and shows up again after reloading/empyting cache etc. I cannot figure out what the source of the error is and why it seems to appear randomly.

Error: [$interpolate:interr] Can't interpolate: {{ showresult(all, two, figs, dates) }} TypeError: dates is undefined

It points to line 10023:

JavaScript:

HTML:

EDIT: When replacing typeof(all) !== undefined with angular.isDefined(all) no error is given in the console anymore but results are either not shown at all or as "undefined", some are returned correctly. I think it could be a timing issue, the variables not being defined when function is called.

WORKAROUND: Instead of calling a function from the view, I build a scope variable (array) with same nested structure as the ng-repeat.

is replaced by

It works without an error but still would like to learn what was wrong with my original code.

根据我对 Angular 2.0 的了解，我有一种感觉，我将使用 Angular 1.x 一段时间。它具有我认为我需要的所有构建块，唯一的缺点是它确实存在脏检查的性能问题，所以我试图更多地考虑这一点。现在 ng-repeat 可能是一个问题，因为它增加了观察者的数量。

所以我有模板的这一部分（玉）：

当这显示 22 个菜单项时，观察者的数量为 90（使用此书签片段）。

我决定尝试使用 $interpolate 来生成该菜单。我最终得到了一个用于编译功能的指令：

根据我的测试，此代码的功能与 ng-repeat 完全相同，输出看起来应该如此。这个版本只有 16 个观察者，当 ng-repeat 显示更多元素时，这个数字不会增加。

由于这段代码只做了这段代码工作所需的最低限度，我想 javascript 本身与为 ng-repeat 执行的代码一样有效（如果不是更有效的话）。

这个假设正确吗？

以这种方式循环 DOM 生成与使用 ng-repeat 相比有什么问题吗？

我在指令中使用了一个模板，如下所示：

当 col.sortField 不存在时，不应渲染属性 st-sort（根本没有属性）。

我已经阅读了 $interpolate 女巫中的 'allOrNothing' 选项可以满足我的要求，但如果在使用 {{ }} 表示法时可以指定此选项，我不会这样做。

我还阅读了有关 ngAttr 的信息，并尝试使用此表示法 ng-attr-st_sort="{{col.sortField}}" 但不再成功。

任何治疗将不胜感激。

让-马克

使用 Angular 插值 {{ blah }} 而不是 ng-bind='blah'使用 ng-translate 时，我看到了意外的行为差异。所以给定一个非常简单的控制器

以下工作完美地使用插值和 ng-bind ..

输出

现在，介绍ng-translate，首先设置简单的翻译表..

接着

产生

然后通过添加“翻译编译”，据我了解，它消除了对“翻译值”的需要，并让“翻译”访问其父范围，相同的 HTML 用“翻译编译”替换“翻译值”

产生相反的结果

例如，请参阅我的plunk

我有一些服务。我想调试它并查看该服务中变量的状态。我的代码如下（代码下方的解释）：

所以，我有一些带有控制器的应用程序mainController。我想在someService其中使用服务。我正在使用push方法。此方法将数据从name参数推送到数据服务total的current数组Data。如您所见，我调用了方法initDebug()from mainController，所以我希望调试窗口出现在我的屏幕上。我想显示数组current和数据服务total的状态unlocked。Data

实际上，窗口出现在屏幕上，但我在上面看到了这个：

所以，AngularJS 模板没有被插值。我如何让它们进行插值 + 我需要在这个块中实时更新它们（就像 angularJS 实际上一样）。

更新

使用 $ 编译。

所以我需要这样改变我的initDebugMode功能？：

将变量传递到服务中的第二个括号究竟是如何$compile工作的？我正确使用了这个？

我创建了一个下拉输入指令，用户可以在其中传入模板字符串来设置列表实际呈现的内容。在我的示例中，我正在传递，<div style="background-color: darkgrey" ng-style="{\'color\': isActive?\'red\':\'blue\'}">{{index}}</div>因此它将呈现项目索引号，然后根据 isActive 对其进行着色。索引显示正确，背景颜色正确但 ng-style 被忽略。我在 setTimeout 中创建模板，因为我必须等待 ng-repeat 渲染<li>.

我正在遍历<li>元素并为每个元素设置模板。我使用 $interpolate 而不是 $compile 因为使用 $compile 会导致 [[Object HTMLDivElement]] 而我不知道为什么。据我所知，$compile 无论如何都使用 $interpolate，它可以工作，除了 ng-style、ng-show 和 ng-hide 不起作用。为什么 Angular 的指令不能与 $interpolate 一起使用？

这是工作示例plunker。

我发现了一些其他问题，即人们试图将 ng-repeat 放入 ng-repeat 中，这似乎是可行的。但是为了完成我需要做的事情，我认为我还需要将第一个 ng-repeat 的插值插入到第二个 ng-repeat 中。例如：

前：

这可能会有点疯狂，尤其是因为我实际上已经达到了“第十八”。

所以这就是我的想法： 之后：

numOfMaps 来自：

然后，因为我需要更多“详细信息”，所以我需要做的就是添加计数和繁荣：它也被添加到 HTML。反正我觉得挺聪明的。。

该区域只是空白，不显示任何内容。

JavaScript 控制台中的错误：错误：[$parse:syntax ] http://errors.angularjs.org/1.2.27/$parse/syntax?p0=x.count&p1=is%20unexpected%2C%20expecting%20%5B% 3A%5D&p2=3&p3=%7B%7Bx.count%7D%7DLinks&p4=x.count%7D%7DLinks at Error (native) at https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/ angular.min.js:6:450 在 gb.throwError ( https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js:170:252 ) 在 gb.consume ( https ://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js:171:181 ) 在 gb.object ( https://ajax.googleapis.com/ajax/libs/angularjs/ 1.2.27/angular.min.js:179:45 ) 在 gb.primary (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js:169:385 ) 在 gb.unary ( https://ajax.googleapis.com/ajax/libs/angularjs /1.2.27/angular.min.js:176:73 ) 在 gb.multiplicative ( https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js:175:310 )在 gb.additive ( https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js:175:170 ) 在 gb.relational ( https://ajax.googleapis.com/ ajax/libs/angularjs/1.2.27/angular.min.js:175:34 ) 在 gb.equality ( https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js :174:400 ) 在 gb.logicalAND ( https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js:174:281) 在 gb.logicalOR ( https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js:174:151 ) 在 gb.ternary ( https://ajax.googleapis.com /ajax/libs/angularjs/1.2.27/angular.min.js:173:461 ) 在 gb.assignment ( https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min. js:173:211 )

结合 Laravel 5（与 Blade）和 Angular 1.3 时，我遇到了一个奇怪的问题。

我对 Laravel 很有经验，但对 Angular 还是个新手。我知道我必须更改 Angular 的分隔符才能使其与 Laravel 的 Blade 一起使用。

所以这就是我所做的：

在我的视图文件中，我定义了 ng-app 和 ng-controller。我的目标是遍历 JSON。JSON 不是上述 JS 的一部分——我知道这一点。

如果我省略 $interpolateProvider 代码，一切正常，控制台上不会显示任何错误。有了它——然而——一切都不再运行了。我得到一个未捕获的错误：[$injector:modulerr]

当我关注它时，我来到：错误：$injector:unpr Unknown Provider

我错过了什么吗？我尝试了来自 AngularJS Docs 和一些教程的代码。所以应该没问题。每次我遇到这个错误时，它都让我发疯。

我有人可以帮我解决这个问题，我将不胜感激。

非常感谢， AFX