angular.js - Angular中的directive指令是否能接受object類型的賦值？

Question

我想寫一個list
利用directive來寫一個item
這個item要根據賦予的不同的值產生相應變化 但目前我只知道簡單的資料賦值
例如

.directive('al-item', function() {
    return {
        restrict: 'EA',
        template: '

<p>'
                 +'</p>

',
        replace: true,
        controller: function($scope, $element, $attrs, $transclude) {
            //这里根据a、b、c 三者的值 进一步修饰al-item
        }
    };
})

<al-item a='' b='' c=''>

我希望的形式 更像是

<al-item object=''>

這樣提供一個object資料
al-item就能實現我預定的樣子
請問這可以實現嗎？

Answer 1

你可以看下關於指令的 scope部分，可以解決你的疑問。

大概：

html<p ng-controller="cc">
<al-item object="obj"></al-item>
</p>

jsangular.module('xx', [])
.controller('cc', ['$scope', function($scope) {
    $scope.obj = {a:'a', b:'b', 'c':'c'}
}])
.directive('alItem', function() {
    return {
        restrict: 'EA',
        template: '<p>'+'</p>',
        replace: true,
        transclude: true,
        scope: {
            object: "="
        },
        controller: function($scope, $element, $attrs, $transclude) {
            //scope.object 这里就可以判断了
        }
    };
})

大概這樣吧 詳細的可以看官方文件了

Answer 2

directive 的 scope 本身就支援三種模式
1. "=" 任何物件
2. "&" 外部的方法傳入 directive 內部呼叫
3. "@" 字串

Answer 3

html裡面的object也是一個attrs, 在function 裡已經調入attrs，可以用attrs直接呼叫object。