这2个Angular代码片段之间的区别是什么?

THa*_*awk 8 javascript angularjs

我正在Coursera上学习AngularJS课程.

教师在视频中演示的代码可以工作但由于某种原因我无法在我的环境中运行:

页面布局(部分):

<div class="media-body">
<h2 class="media-heading">{{dish.name}}
<span class="label label-danger">{{dish.label}}</span>
<span class="badge">{{dish.price | currency}}</span></h2>
<p>{{dish.description}}</p>
</div>
Run Code Online (Sandbox Code Playgroud)

片段A(教授证明我无法上班):

var app = angular.module('confusionApp',[]);        
app.controller('dishDetailController', function() {

var dish={ //attributes here; };

this.dish = dish;

});
Run Code Online (Sandbox Code Playgroud)

当我运行此功能时,我在控制台中没有出现任何错误,但我在显示屏上没有任何内容.

代码片段B:

var app = angular.module('confusionApp',[]);
app.controller('dishDetailController', function($scope) {

var dish={ //attributes here;};

$scope.dish = dish;
});
Run Code Online (Sandbox Code Playgroud)

当我这样做时,它的工作原理.有区别吗?

jmu*_*sch 6

由于控制器的连接方式,Snippet A最不可能工作.我在这里疯狂猜测.

在哪里添加ng-controller它应该看起来像:

 <body ng-controller="dishDetailController as dish">
Run Code Online (Sandbox Code Playgroud)

你可能会在哪里改为:

 <body ng-controller="dishDetailController">
Run Code Online (Sandbox Code Playgroud)

可能不是身体标签可能是div或其他东西.

为了更好地理解它在片段内的控制器尝试:

var app = angular.module('confusionApp',[]);        
app.controller('dishDetailController', function() {

    this = {//attributes here}

});
Run Code Online (Sandbox Code Playgroud)

否则你可能必须{{dish.dish.stuff}}在模板内写: