angularjs链接发生在替换之前

angularjs link happens before replace

本文关键字:替换 链接 接发 angularjs      更新时间:2023-09-26

在下面的代码片段中,我需要在编译和替换模板后从元素中提取callclass属性。每当我尝试获取attr对象时,它引用的是父元素<servicedesk>,而不是属性所在的替换模板。我该怎么解决这个问题?

app.directive('servicedesk', ['_sys_ctx', '_sys_servicedesk', '_sys_dictionary',
    function(_sys_ctx, _sys_servicedesk, dictionary) {
        return {
            restrict: "E",
            scope: true,
            templateUrl: "partials/directives/servicedesk.html",
            link: function(scope, elem, attr) {
                scope.data = _sys_servicedesk.retrieve(_sys_ctx);
                scope.scopename = "servicedesk_directive";
                var callclasses = dictionary.define('callclass');
                console.log(callclasses);
                attr.$observe('callclass', function(value) {
                    console.log(value)
                });
                scope.callclass = callclasses[attr.callclass];
            }
        }
    }
]);

这是模板

<card ng-repeat="record in data" name="{{record.name}}" callclass="{{record.class}}">
    <header>{{callclass}}</header>
    <div class="calldetail">
        <div class="userimg">
            <img src="{{record.picture}}" alt="" />
        </div>
        <ul class="custinfo">
            <li class="name">
                <h3>{{record.name}}</h3>
            </li>
            <li class="phone">
                <h3>{{record.phone}}</h3>
            </li>
            <li class="email">
                <h3>{{record.email}}</h3>
            </li>
        </ul>
        <div class="summary">
            {{record.summary}}
        </div>
    </div>
    <ul>
        <li>
            <div class="description">
                {{record.description}}
            </div>
        </li>
        <li>
            <span class="status">
                {{record.status}}
            </span>
        </li>
    </ul>
</card>

servicedesk元素所在的视图只不过是这个

<servicedesk></servicedesk>

如果它是相关的,那么视图也有自己的控制器。除了callclass之外,其他一切都很好,因为当我试图从链接函数内部记录elemattrs对象时,它引用的是<servicedesk>元素,而不是替换模板。

您只需将属性replace: true添加到指令返回对象中,这样您的<servicedesk>元素将被您的模板替换,您可以访问<card>标记的attrs