Question

我是AngularJS的新手，我在为我的页面创建控制器时遇到了麻烦

这是一个加载app.js文件的简单页面，该文件包含$ scope.name =＆＃34; james＆＃34 ;; 并且我使用表达式{{$ scope.name}}来显示那个没有出现的值..但是当我运行{{2 + 4}}时它显示6这样有角度的工作..
另一件事是当我在safari中打开页面时，表达式正在显示为原始的（意思是：＆＃39; {{2 + 4}}＆＃39;）但是chrome会运行它并显示结果..

这是我的代码.. 谢谢你的帮助

HTML
        <!DOCTYPE html>
    <html>
    <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular.min.js"></script> 
        <script src="app.js"></script>

        <meta charset="utf-8">

        <title></title>
    </head>

    <body>

    <div data-ng-app="myApp" data-ng-controller="myCtrl">
        {{  $scope.name }}
        {{  2 + 4 }}


        </div>


    </body>
    </html>

app.js

   var myApp = angular.module('myApp', []);

myApp.controller('myCtrl', function($scope){

   $scope.name = "James"
})

Answer 1

对我来说似乎工作正常，这里是一个笨蛋。 https://plnkr.co/edit/uXqvoIrgNjEZq8cHRE3Z?p=preview

我正在使用角度风格指南。 https://github.com/johnpapa/angular-styleguide/blob/master/a1/README.md

<script src="https://code.angularjs.org/1.5.5/angular.js"></script>
<script src="./script.js"></script>
<div ng-app="myApp">
    <div ng-controller="myCtrl as vm">
       {{  vm.name }}
        {{  2 + 4 }}
    </div> 
</div>

(function() {
    'use strict';
angular
  .module('myApp', [])
  .controller('myCtrl', myCtrl);

   function myCtrl(){
       /* jshint validthis: true */
       var vm=this;
       vm.name = "James";
   } 

})();

Answer 2

你的问题是，你误解了$scope的工作原理。

$scope是AngularJs提供的一个特殊对象，它允许你为它添加属性，AngularJs会将Watchers附加到它，用于双向绑定。在您的HTML表达式（{{ }}）中，您没有引用$scope，而是引用您感兴趣的$scope属性。

换句话说，您应该只使用{{ $scope.name }}而不是{{ name }}。

请注意，有许多样式指南会建议使用$scope的替代方法，但在更高级的情况下，$scope最重要的方面是始终在绑定中使用点，如果可能的话。

angularJS基础苦苦挣扎 - 控制器

2 个答案: