发表于: 2017-06-27 21:54:07
2 867
这几天做样式,发现了几个新坑。
<a><h1>这俩标签的字体颜色都不能被继承!!!
老看大家用VM作为变量名然后就去了解了一番:
Vm指的是View Model
历史原因
controller as 是1.2之后才有,和 $scope 作用其实一样,哪怕你混合着用也是没有问题,但这样看起来非常的奇怪。
模板作用域
当然,不光如此,不然还要造个 controller as 做什么,是吧!
这是因为早先 $scope 对于子组件默认继承父组件的数据,但又不会被覆盖,而反之又是隔离的,例如:
function ParentCtrl($scope) {
$scope.name = 'asdf';
$scope.age = 25;
}
function ChildCtrl($scope) {
$scope.age = 26;
}
<div ng-controller="ParentCtrl">
<p>name:{{name}},age:{{age}}</p>
<div ng-controller="ChildCtrl">
<p>child name:{{name}},age:{{age}}</p>
</div>
</div>
ChildCtrl 并没有定义 name,但依然可以显示:asdf。这就是继承关系,通过这种方式来访问一些变量很不可靠,或者说并不直观。所以,才有 controller as。
<div ng-controller="ParentCtrl as p">
<p>name:{{p.name}},age:{{p.age}}</p>
<div ng-controller="ChildCtrl as c">
<p>child name:{{p.name}},age:{{c.age}}</p>
</div>
</div>
这样的写法不是更明了,直观了吗?
控制器 $scope !== this
先理解模板,那再看这一条就明了许多。
为了不让 $scope 默认继承父组件的内容,因此需要使用 this 让这些东西不再和子组件有瓜葛。
function ChildCtrl($scope) {
var vm = this;
console.log(vm === $scope) // false;
}
this 与 $scope 完全不一样,前者就是明确表示控制组实例,而后者是一个比较奇特的this怪咖。
最后关于 var vm = this愿意叫一个 var funkScopeTenThousandsYear = this 也行。
来自 <https://segmentfault.com/q/1010000008883278>
还看了mock的东西。不过还不则么熟练。
问题:三个人写前端。SVN合并日常会炸一波!
明天昨啥:这几天进度感觉是真的正常了起来。
评论