Question

我试图通过我的HTML模板将控件中的对象传递给指令，以便在另一个HTML模板中使用该对象。

我有一个控制器：

function controller($state, $rootScope) {
    var vm = this;
    vm.residents = [object];
}

在我的配置中：

function config($sateprovider) {
    [..],
    templateUrl: [..]/template.html,
    [..]
}

在templtate.html中我得到了：

<div ng-repeat="resident in controller.residents>
    <user-block user={{ resident }}></user-block>
</div>

在我的用户块中，我得到了：

function userBlock() {
    restrict: 'E',
    templateUrl: [..]/userblock.html,
    controller: 'blockController',
    controllerAs: 'blockCtrl',
    bindTocController: true,
    replace: true,
    scope: {
        user: '@',
    }
}

最终在userblock.html：

<div>{{ blockCtrl.user }}</div>

我得到了以下输出：

{ “用户名”： “Xiduzo”， “USER_ID”：123， “经验”：123456789， “total_energy”：100， “energy_left”：50 “卢比”：[{ “名称”： “绿宝石”， “量”：106}，{ “名称”： “蓝宝石”， “量”：43}，{ “名称”： “紫晶”， “量”：131}，{ “名称”： “红宝石”，“量“：11}，{” 名称 “：” 黄水晶”， “量”：159}，{ “名称”： “煤”， “量”：23}]}

但是当我想获得用户名时，请执行以下操作：

<div>{{  blockCtrl.user.username }}</div>

我根本没有输出。

我有什么遗漏或做错了吗？

Answer 1

基本上，问题是您正在使用@绑定（单向绑定），通过该绑定将user对象传递给指令隔离范围。但事情是@cverts字符串中的任何类型的变量。因此，当用户变量到达指令scope时，它不是纯粹的用户object。它只是用户JSON对象的字符串化版本。

这就是为什么当你尝试访问它时，JSON没有工作。

我建议您使用=传递该字段（双向绑定）将使其工作并保持对象类型。

更改

scope: {
    user: '@',
}

要

scope: {
    user: '=',
}

和

<user-block user=resident></user-block>

通过指令范围传递对象不起作用

1 个答案: