html - 将 Angular JS ui-bootstrap 下拉切换绑定(bind)到 ng-model

Question

我正在尝试在表单上使用 angularjs bootstrap 下拉开关，我需要能够将所选项目绑定(bind)回我的应用程序中新“组织”的模型。

这是我用来创建所有控件的 js 模块:

var Controls = angular.module('PulseControls', ['ui.bootstrap']);

var booleanButtonCtrl = function($scope) {
    $scope.radioModel = true;  
};

var currencyDropDownButtonCtrl = function($scope) {
    $scope.currencies = [{
        id: 1,
        name: 'US Dollar'
    }, {
    id: 2,
    name: 'Euro'
}, {
    id: 3,
    name: 'Australian Dollar'
}];    
};

这是我的 CreateNewOrganisation Controller 的起始代码

function CreateOrganisationController($scope, $http, $window) {
    $scope.newOrganisation = {
        isActive: true,
};

最后，这是我的 html 代码片段，其中包括“状态”和“货币”，两者都使用 ui-bootstrap...

        <div class="form-group">
            <label class="control-label">Status</label><br />
            <div ng-controller="booleanButtonCtrl">
                <div class="btn-group">
                    <button type="button"
                            class="btn btn-primary"
                            data-ng-model="newOrganisation.isActive"
                            btn-radio="true">
                        Active
                    </button>
                    <button type="button"
                            class="btn btn-primary"
                            data-ng-model="newOrganisation.isActive"
                            btn-radio="false">
                        Dormant
                    </button>
                </div>
            </div>
        </div>

        <div class="form-group">
            <label class="control-label">Currency</label>
            <div class="dropdown" data-ng-controller="dropDownButtonCtrl">
                <div class="btn-group">
                    <a class="btn btn-primary dropdown-toggle">Please select<span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li ng-repeat="currency in currencies">
                            <a ng-model = "newOrganisation.currency">{{currency.name}}</a>
                        </li>
                    </ul>
                </div>

            </div>
        </div>

Status 中采用的方法效果很好，但我无法使 Currency 的下拉控件正常工作。有什么建议吗？

Answer 1

<div class="dropdown" data-ng-controller="dropDownButtonCtrl">

我怀疑这里data-ng-controller的值应该是

currencyDropDownButtonCtrl