Question

我只是想让一个AngularJS表达式显示在屏幕上。但是，大括号之间没有任何东西出现。我用ng-inspector检查了应用程序，虽然我看到使用ng-model指令创建了一个对象，但我无法使用对象键显示该值。

此外，出于测试目的，我甚至无法显示简单的数学表达式。

以下是我正在使用的内容。

<body ng-app="angularApp">
    <div ng-controller="firstCtrl">
      <input ng-model="project.completed" type="checkbox">
      <input ng-model="project.title" type="text" placeholder="Project Title">
      <label>
          {{project.title}}
          1+2={{1 + 2}}
      </label>
      <input ng-model="project.time" type="text" placeholder="Project Time">
      <label for="">{{project.time}}</label>
      <button ng-click="helloWorld()">Press Me</button>
    </div>
</body>

......这是控制器：

angular.module('angularApp', [])

.controller('firstCtrl', function($scope) {
    $scope.helloWorld = function() {
        console.log('You just pressed the button.');
    };

    $scope.project = {
        completed :false,
        title :'test',
    };

});

标签中唯一显示的是“1 + 2 =”。

更新：在花费了大量时间尝试调试之后，我已经能够获得要显示的数学表达式的第一个值 - “1”。我通过在'+'运算符周围添加一个空格来实现这一点。尽管如此，完整的表达还没有评估。

Answer 1

如果您正在使用其他模板引擎，例如Twig，Liquid或Django，则花括号可能会被剥离。这导致值无法正确显示或评估。

我找到的解决方案是在控制器中编辑插值字符或$ interpolateProvider：

angular.module('angularApp', []).config(function($interpolateProvider){
    $interpolateProvider.startSymbol('{[{').endSymbol('}]}');
})

然后，只需将表达式包装在新符号中，例如：

{[{ 1+2 }]}

...或

{[{ project.title }]}

Answer 2

我遇到了同样的问题，最后找到了它，只需打开您的网页并按f12键并查看控制台即可：)还要删除所有未使用的CSS。另外，请确保在标签或其他广泛的范围内添加“ ng-controller”，以使其在范围内完全覆盖。

AngularJS表达式未显示

2 个答案: