Pay*_*Chu 2 javascript directive class angularjs
我正在从教程EggHead angular.element学习并遵循它来创建测试脚本.但是我的angular.element的行为与教程不同.toggleClass或addClass将"class"添加到"input"和"div".见下面的剧本和图片.这是一个错误吗?或者我错过了什么?
<html ng-app="app">
<head lang="en">
<meta charset="utf-8" />
<title>Debug</title>
<link rel="stylesheet" href="/css/foundation.css" />
</head>
<body>
<dumb-password></dumb-password>
<script src="/js/angular-1.2.0rc1/angular.js"></script>
<script>
angular.module('app', [])
.directive('dumbPassword', function () {
return {
restrict: 'E',
replace: true,
template: '<div><input type="text" ng-model="model.input"><div>{{model.input}}</div></div>',
link: function (scope, element) {
scope.$watch('model.input', function (value) {
if (value === 'password') {
element.children(1).toggleClass('alert-box alert')
} else {
element.children(1).removeClass('alert-box alert')
}
})
}
}
})
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

在这个功能:
link: function (scope, element)
Run Code Online (Sandbox Code Playgroud)
element是你的容器div,并且element.children(1)不接受选择器所以它将获得所有的孩子.来自angular.element.尝试:
element.children().eq(1)
Run Code Online (Sandbox Code Playgroud)
要么
element.find("div")
Run Code Online (Sandbox Code Playgroud)