根据选择

时间:2016-06-04 18:21:59

标签: javascript angularjs

所以我有两个显示/输出。 [A]和[B]。我在控制器中也有一堆函数,它们当前只是通过一个小键盘来实现[A]。我正在尝试创建一个改变小键盘效果的函数。 IE,如果选择[A],小键盘将起作用[A];如果选择[B],小键盘将不再影响[A]而是影响[B]。

这就是我所拥有的:

<div ng-class="{selected:vm.selectedInput==='A'}" ng-click="vm.selectInput('A')">{{vm.A}}</div>
<div ng-class="{selected:vm.selectedInput==='B'}" ng-click="vm.selectInput('B')">{{vm.B}}</div>


.controller('selController', function($scope) { 

  var vm = this;
  vm.selectedInput = 'A';
  vm.selectedOutput = vm.A;

  vm.selectInput = function(input) {
    vm.selectedInput = input;
    switch(input) {
        case 'A':
            vm.selectedOutput = vm.A;
            break;
        case 'B':
            vm.selectedOutput = vm.B;
            break;
    }
  };
};

之后的一些函数会影响vm.selectedOutput,理论上应该根据选择的div在vm.A和vm.B之间进行更改。

不起作用的示例功能:

vm.clear= function () {
  vm.selectedOutput = '0';
};

2 个答案:

答案 0 :(得分:0)

angular.module('todo', ['ionic'])

.controller('MyCtrl', function($scope) {
  var vm = this;
  vm.A = '5';
  vm.B = '6';

  vm.selectedOutput = vm.A;

  vm.selectInput = function(input) {
    console.log(input);
    vm.selectedInput = input;
    switch (input) {
      case 'A':
        vm.selectedOutput = vm.A;
        break;
      case 'B':
        vm.selectedOutput = vm.B;
        break;
    }
    console.log(vm.selectedOutput);

  };

  vm.clear = function() {
    vm.selectedOutput = '0';
  };

})

查看下面的Plunker代码, http://plnkr.co/edit/2Iwabg5bJgf87myDdXIg

答案 1 :(得分:0)

我能够通过为变量创建数据对象来解决我的问题。

vm.select = {
    A: {
      name: 'A',
      value: '5'
    },
    B: {
      name: 'B',
      value: '6'
    }
  };