Question

我遇到了一些问题，我已经创建了一个$scope.msg并且它已经很好地打印到我的控制台了，但它不会渲染本身就是DOM。我使用Browserify来要求角度和捆绑我的js。

的index.html

<body ng-app="zeroApp" ng-controller="MainCtrl">
  <div class="container">
    <div class="item">
      <h1>{{ msg }}</h1>
    </div>
  </div>
<script src="./js/app.js"></script>
</body>

app.js

(function() {
  'use strict';
  var angular = require('angular');
  angular.module('zeroApp', [])
  .controller('MainCtrl', ['$scope', function($scope) {
      $scope.msg = "Hello Angular!";
      console.log($scope.msg);
  }]);
})();

为什么没有将这些内容暴露给DOM并且我的<h1>元素为空？

感谢任何帮助。提前谢谢！

Answer 1

不幸的是我不是Angular专家所以我无法解释细节，但问题是Angular不会检测到这种变化，因此它不会传播到视图中。还有其他方法，但一个相当简单的解决方法是将消息包装到一个额外的对象中。不要使用$scope.msg，而是尝试使用$scope.msg.txt，它应该有效。

希望对Angular内部运作有更多了解的人可以进一步澄清这一点。

这是另一个演示的小提琴：http://jsfiddle.net/29Luq8ns/1/

注意我正在使用$timeout。这是解决问题的另一种方法。通过更改$scope.msg函数内的$timeout，即使没有延迟参数，也可以正常工作。

Answer 2

想出来。我在我的gulpfile.js中使用Swig来渲染我的HTML模板。 Swig的小胡子模板语言肯定与Angular的模板语言相冲突。从我的构建过程中解脱出来它就像一个魅力。

感谢您的帮助。

Angular：$ scope.msg出现在控制台中，而不是DOM上

2 个答案: