从按钮列表中选择角度按钮

时间:2017-05-04 14:13:42

标签: javascript html angularjs

我试图让我的一个按钮被选中,既可以在init上进行一次更改,也可以选择css进行选择,然后在单击时替换它并将其保持为选中状态。当前单击按钮切换到选中并返回到未选中状态。另外,我需要将它们保持为一次只选择一个。

我的角度模块代码:

'use strict';
(function () {

class operationBroadComponent {
    constructor() {
        this.buttonsList1 = [
            {title: 'title1', iconDefaultPath: 'icon0 tab enable', iconPressedPath: 'icon0 tab selected'},
            {title: 'title2', iconDefaultPath: 'icon1 tab enable', iconPressedPath: 'icon1 tab selected'},
            {title: 'title3', iconDefaultPath: 'icon2 tab enable', iconPressedPath: 'icon2 tab selected'},
        ]
    }
}

$onInit() {

}

$onChanges(changedObj) {

}

angular.module('myApp')
.component('operationBroad', {
    templateUrl: 'app/windowsComponent/operationBroad/operationBroad.html',
    controller: operationBroadComponent,
    transclude: true,
    bindings: {}
})
.controller('OperationBroadCtrl', function($scope, $http){
    var mybtnList = $scope.$parent.$ctrl.buttonsList1;
});


})();    

我的HTML代码:

<div class="operation-broad-container" ng-controller="OperationBroadCtrl">
<div class="col buttons-container">
    <operation-button ng-repeat="button in $ctrl.buttonsList1"
                      title="{{button.title}}"
                      default-img="{{button.iconDefaultPath}}"
                      pressed-img="{{button.iconPressedPath}}">>
    </operation-button>
</div>

感谢。

0 个答案:

没有答案