ANgularjs:ng-repeat和嵌套的自定义指令

fcracker79

我正在尝试ng-repeat一个自定义指令,该指令具有应在迭代过程中更改的属性。

这是我的html:

<div ng-controller="WalletsController as controller">
    <bitcoin-address ng-repeat="bitcoin_label in controller.getWallets()"  bitcoin-label="bitcoin_label"></bitcoin-address>
</div>

这是我的控制器:

(function() {
var app = angular.module('wallets', [ ]);

app.controller(
        "WalletsController",
        function($scope, $http) {
            this.wallets = [];

            var controller = this;

            this.getWallets = function() {
                return controller.wallets;
            };

            $http.get("wallet_addresses").success(
                    function(data) {
                        for (var i = 0; i < data.length; i++) {
                            var curWallet = data[i];
                            $scope[curWallet.label] = {
                                label: curWallet.label,
                                address: curWallet.address,
                                balance: curWallet.balance
                            };
                            controller.wallets.push(curWallet.label);
                        }
                    }
            );
        });

app.directive(
        'bitcoinAddress',
        function() {
            return {
                restrict: 'E',
                templateUrl: '../../resources/html/bitcoin-address.html',
                scope: {
                    bitcoinLabel: '=',
                }
            };
        }
);
})();

这是我的模板:

<div class="col-md-8 dashboardAddressCell dropdown-toggle" data-toggle="dropdown">{{bitcoinLabel.address}}</div>

发生的情况是模板无法解析bitcoinLabel变量。我尝试指定一个常量值,并且该模板有效。我的结论是我没有在html部分中正确指定bitcoin_label属性。我也尝试过使用{{bitcoin_address}},但是angularjs对此有所抱怨。

我也尝试使用以下html代码:

<div ng-controller="WalletsController as controller">
        <!-- <tr><th>Indirizzo</th><th>Saldo</th><th></th>-->
        <div ng-repeat="bitcoin_label in controller.getWallets()">
            {{bitcoin_label}}
            <bitcoin-address bitcoin-label="bitcoin_label"></bitcoin-address>
        </div> 
        <bitcoin-address  bitcoin-label="ciccio"></bitcoin-address>
    </div>

它也不起作用,但是至少它显示{{bitcoin_label}}值。

dfsq

这个问题似乎很简单。代替

controller.wallets.push(curWallet.label);

您应该推送相应的$scope[curWallet.label]对象:

controller.wallets.push($scope[curWallet.label]);

因为curWallet.label只是一个字符串,所以在第一种情况下wallets字符串数组结尾。然而,你需要wallets成为对象的数组,每一个具有addresslabelbalance性质。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

ANgularjs:ng-repeat和嵌套的自定义指令

来自分类Dev

使用ng-repeat嵌套自定义指令

来自分类Dev

带templateUrl和ng-repeat的自定义指令

来自分类Dev

带templateUrl和ng-repeat的自定义指令

来自分类Dev

AngularJS自定义指令ng-repeat,无法调用null的方法“ insertBefore”

来自分类Dev

与ng-repeat相同的HTML元素上的AngularJS自定义指令

来自分类Dev

AngularJS-从自定义指令将参数从ng-repeat传递到控制器

来自分类Dev

AngularJS:ng-repeat在具有隔离范围的自定义指令上

来自分类Dev

在 AngularJS 中的 ng-repeat 指令中使用自定义过滤器订购数据

来自分类Dev

有角度的。内含ng-repeat的自定义指令

来自分类Dev

AngularJS:自定义包含后ng-if和ng-repeat不起作用

来自分类Dev

使用自定义指令,ng-show和$ scope在Angularjs中隐藏/显示元素

来自分类Dev

使用自定义指令,ng-show和$ scope在Angularjs中隐藏/显示元素

来自分类Dev

如何为ng-table创建自定义指令(对表和ng-repeat使用不同的数据)

来自分类Dev

如何为ng-table创建自定义指令(对表和ng-repeat使用不同的数据)

来自分类Dev

在AngularJS ng-repeat中过滤“自定义值”

来自分类Dev

AngularJS自定义指令

来自分类Dev

angularjs ng-include和angularjs自定义指令不希望一起工作

来自分类Dev

AngularJS中的自定义指令和路由

来自分类Dev

自定义ngTagsInput和autoComplete指令(AngularJS)

来自分类Dev

AngularJS和自定义方法/ HTML的指令

来自分类Dev

AngularJS,嵌套JSON和ng-repeat

来自分类Dev

自定义指令中的ng-repeat:语法错误:令牌'$ index'是意外的

来自分类Dev

在替换ng-repeat之前,将调用自定义指令的链接功能

来自分类Dev

带有ng-repeat作为自包含内容的自定义指令

来自分类Dev

使用自定义指令进行ng-repeat数据绑定

来自分类Dev

使用自定义指令进行ng-repeat数据绑定

来自分类Dev

使用自定义指令使用ng-repeat显示2个不同的表

来自分类Dev

自定义指令中的ng-repeat:语法错误:令牌'$ index'是意外的

Related 相关文章

  1. 1

    ANgularjs:ng-repeat和嵌套的自定义指令

  2. 2

    使用ng-repeat嵌套自定义指令

  3. 3

    带templateUrl和ng-repeat的自定义指令

  4. 4

    带templateUrl和ng-repeat的自定义指令

  5. 5

    AngularJS自定义指令ng-repeat,无法调用null的方法“ insertBefore”

  6. 6

    与ng-repeat相同的HTML元素上的AngularJS自定义指令

  7. 7

    AngularJS-从自定义指令将参数从ng-repeat传递到控制器

  8. 8

    AngularJS:ng-repeat在具有隔离范围的自定义指令上

  9. 9

    在 AngularJS 中的 ng-repeat 指令中使用自定义过滤器订购数据

  10. 10

    有角度的。内含ng-repeat的自定义指令

  11. 11

    AngularJS:自定义包含后ng-if和ng-repeat不起作用

  12. 12

    使用自定义指令,ng-show和$ scope在Angularjs中隐藏/显示元素

  13. 13

    使用自定义指令,ng-show和$ scope在Angularjs中隐藏/显示元素

  14. 14

    如何为ng-table创建自定义指令(对表和ng-repeat使用不同的数据)

  15. 15

    如何为ng-table创建自定义指令(对表和ng-repeat使用不同的数据)

  16. 16

    在AngularJS ng-repeat中过滤“自定义值”

  17. 17

    AngularJS自定义指令

  18. 18

    angularjs ng-include和angularjs自定义指令不希望一起工作

  19. 19

    AngularJS中的自定义指令和路由

  20. 20

    自定义ngTagsInput和autoComplete指令(AngularJS)

  21. 21

    AngularJS和自定义方法/ HTML的指令

  22. 22

    AngularJS,嵌套JSON和ng-repeat

  23. 23

    自定义指令中的ng-repeat:语法错误:令牌'$ index'是意外的

  24. 24

    在替换ng-repeat之前,将调用自定义指令的链接功能

  25. 25

    带有ng-repeat作为自包含内容的自定义指令

  26. 26

    使用自定义指令进行ng-repeat数据绑定

  27. 27

    使用自定义指令进行ng-repeat数据绑定

  28. 28

    使用自定义指令使用ng-repeat显示2个不同的表

  29. 29

    自定义指令中的ng-repeat:语法错误:令牌'$ index'是意外的

热门标签

归档