Fatal编程技术网
  • javascript/
  • Javascript ng模型中带有<；用户界面选择>；与native不同<；选择>；

Javascript ng模型中带有<；用户界面选择>；与native不同<；选择>；

javascript html angularjs

Javascript ng模型中带有<；用户界面选择>；与native不同<；选择>；,javascript,html,angularjs,ng-options,ui-select,Javascript,Html,Angularjs,Ng Options,Ui Select,我想用angular ui select framework替换本机。但是我遇到了问题，因为替换后，ng model变量中的值不保持不变。我想我不太明白ui-select 以下是更换前后的我的代码： 带有nativ-标签 <select class="form-control ll-selbox ll-ptrhand" ng-model="newitem.type" ng-options="item.id as item.title | translate for item in type

我想用angular ui select framework替换本机
。但是我遇到了问题，因为替换后，
ng model
变量中的值不保持不变。我想我不太明白
ui-select

以下是更换前后的我的代码：

带有nativ
-标签

<select class="form-control ll-selbox ll-ptrhand" ng-model="newitem.type" ng-options="item.id as item.title | translate for item in types" ng-selected="updateComboboxes(0)"></select>
在
$scope.newitem.type中
：

“CT”
（字符串）

使用
角度用户界面选择
-框架标签：


<ui-select class="ll-selbox " ng-model="newitem.type" theme="bootstrap" on-select="updateComboboxes(0)">
    <ui-select-match>{{$select.selected.title | translate}}</ui-select-match>
    <ui-select-choices location="wflowmodify" repeat="item in types | filter: $select.search" refresh-delay="0">
        <span ng-bind-html="item.title | translate | highlight: $select.search"></span>
    </ui-select-choices>
</ui-select>


在
$scope.newitem.type
：（
copy（）
ed关闭控制台）


控制器
：


cmod.controller('WorkflowModifierEditorCtrl', function ($rootScope, $scope, $modalInstance, i18n, subtitle, procid, modifiers, Restangular, WorkflowModifyService, AlertService, featureFlags) {
  $scope.modifiers = modifiers;
  $scope.subtitle = subtitle;
  $scope.procid = procid;

  $scope.types = [];
  $scope.codes = [];
  $scope.triggers = [];
  $scope.resolutions = [];

  $scope.newitem = {type: 'CT', code: '', trigger: '', res: ''};

  $scope.refreshData = function () {
    // Calling route CHECK_8
    Restangular.one('wflowmod').get({proc: procid}).then(function (data) {
      // types of rules ("workflow modifiers")
      if (data.checktypes && data.checktypes.length > 0) $scope.types.push({id: 'CT', title: 'WFLOWEDIT.OPT1.CT'});
      if (data.models && data.models.length > 0) $scope.types.push({id: 'MD', title: 'WFLOWEDIT.OPT1.MD'});
      if (data.devicetypes && data.devicetypes.length > 0) $scope.types.push({id: 'DT', title: 'WFLOWEDIT.OPT1.DT'});
      if (featureFlags.isOn("configtable") && data.configtables && data.configtables.length > 0) $scope.types.push({
        id: 'CO',
        title: 'WFLOWEDIT.OPT1.CO'
      });

      if (data.procedures && data.procedures.length > 0) $scope.types.push({id: 'P', title: 'WFLOWEDIT.OPT1.P'});
      if (data.steps && data.steps.length > 0) $scope.types.push({id: 'S', title: 'WFLOWEDIT.OPT1.S'});
      if (data.measures && data.measures.length > 0) $scope.types.push({id: 'M', title: 'WFLOWEDIT.OPT1.M'});
      if ($scope.types.length < 1) $modalInstance.dismiss();
      $scope.newitem.type = $scope.types[0].id;
      $scope.resdata = data;
      $scope.updateComboboxes(0);
      $scope.wfmods = WorkflowModifyService.getWorkflowModifiersForDisplay($scope.modifiers);
      $scope.wfModEditorLoaded = true;
    }, AlertService.showSevereRESTError)
  };

  $scope.oldType = null;
  $scope.oldTrigger = null;

  $scope.updateComboboxes = function (what) {
    console.log($scope.types);
    console.log($scope.newitem.type);
    // $scope.newitem.type = $scope.newitem.type.id;
    if (!$scope.resdata) return;
    if (what == 0) {
      if ($scope.oldType == $scope.newitem.type) return;
      $scope.oldType = $scope.newitem.type;
      $scope.codes = _.map(
        $scope.resdata[{
          CT: 'checktypes',
          MD: 'models',
          DT: 'devicetypes',
          P: 'procedures',
          S: 'steps',
          M: 'measures',
          CO: 'configtables'
        }[$scope.newitem.type]],
        function (entry) {
          var lang = i18n.getSelectedLanguage()['code'];
          var listitem = {};
          if (typeof entry === "string") {
            listitem.id = entry;
            listitem.title = entry;
          }
          else {
            // title will be translated when available, else just set the whole (e.g. configtables)
            listitem.id = entry[0];
            listitem.title = entry[0] + " - " + ( entry[1][lang] ? i18n.translate(entry[1]) : entry[1] );
          }
          return listitem;
        }
      );
      $scope.newitem.code = $scope.codes[0].id;
      var triggers = [];
      if (_.contains(['CT', 'MD', 'DT'], $scope.newitem.type)) {
        triggers.push({id: 'Select', title: 'WFLOWEDIT.OPT2.SEL'});
        triggers.push({id: '!Select', title: 'WFLOWEDIT.OPT2.NSEL'});
      }
      if (_.contains(['CO'], $scope.newitem.type)) {
        triggers.push({id: '!Select', title: 'WFLOWEDIT.OPT2.NACTIVE'});
        triggers.push({id: 'Select', title: 'WFLOWEDIT.OPT2.ACTIVE'});
      }
      if (_.contains(['P'], $scope.newitem.type)) {
        triggers.push({id: 'InQueue', title: 'WFLOWEDIT.OPT2.QUEUED'});
        triggers.push({id: '!InQueue', title: 'WFLOWEDIT.OPT2.NQUEUED'});
      }
      if (_.contains(['P', 'M', 'S'], $scope.newitem.type)) {
        triggers.push({id: 'Pass', title: 'WFLOWEDIT.OPT2.FINPASS'});
        triggers.push({id: 'Fail', title: 'WFLOWEDIT.OPT2.FINFAIL'});
        triggers.push({id: 'Skip', title: 'WFLOWEDIT.OPT2.SKIP'});
        triggers.push({id: '!Skip', title: 'WFLOWEDIT.OPT2.NSKIP'});
        triggers.push({id: 'Omit', title: 'WFLOWEDIT.OPT2.OMIT'});
        triggers.push({id: '!Omit', title: 'WFLOWEDIT.OPT2.NOMIT'});
      }
      if (_.contains(['M'], $scope.newitem.type)) {
        triggers.push({id: 'Yes', title: 'WFLOWEDIT.OPT2.YES'});
        triggers.push({id: 'No', title: 'WFLOWEDIT.OPT2.NO'});
      }
      $scope.triggers = triggers;
      $scope.newitem.trigger = $scope.triggers[0].id;
    }
    if ($scope.oldTrigger == $scope.newitem.trigger) return;
    $scope.oldTrigger = $scope.newitem.trigger;
    var resolutions = [{id: 'omit', title: 'WFLOWEDIT.OPT3.OMIT'}];
    if (!_.contains(['Select', '!Select', 'InQueue', '!InQueue'], $scope.newitem.trigger)) resolutions.push({
      id: 'skip',
      title: 'WFLOWEDIT.OPT3.SKIP'
    });
    $scope.resolutions = resolutions;
    $scope.newitem.res = $scope.resolutions[0].id;
  };

  $scope.addWorkflowModifier = function () {
    var newitem = {};
    newitem.type = $scope.newitem.type;
    newitem.code = $scope.newitem.code;
    newitem.res = $scope.newitem.res;
    if ($scope.newitem.trigger.substr(0, 1) == "!") {
      newitem.trigger = $scope.newitem.trigger.substr(1);
      newitem.inverse = true;
    } else {
      newitem.trigger = $scope.newitem.trigger;
    }
    $scope.modifiers.push(newitem);
    $scope.wfmods = WorkflowModifyService.getWorkflowModifiersForDisplay($scope.modifiers);
  };

  $scope.removeWorkflowModifier = function (idx) {
    var el = $scope.modifiers[idx - 1];
    if (el.type === 'CO') {
      var type = $scope.subtitle.msg.charAt(0).toLowerCase();
      var id = $rootScope.selecteditem.id;
      Restangular.one('configentry', el.code).one('blocker', type).one('id', id).remove().then(function (data) {
        // pass
      }, AlertService.showSevereRESTError);
    }

    $scope.modifiers.splice(idx - 1, 1);
    $scope.wfmods = WorkflowModifyService.getWorkflowModifiersForDisplay($scope.modifiers);
  };

  $scope.refreshData();

  $scope.close = function () {
    $modalInstance.close()
  };
});



cmod.controller（'WorkflowModifierReditorCtrl'，function（$rootScope，$scope，$modalInstance，i18n，subtitle，procid，修饰符，restanglar，WorkflowModifyService，AlertService，featureFlags）{
$scope.modifiers=修饰符；
$scope.subtitle=副标题；
$scope.procid=procid；
$scope.types=[]；
$scope.code=[]；
$scope.triggers=[]；
$scope.resolutions=[]；
$scope.newitem={type:'CT'，code:''，触发器：''，res:'}；
$scope.refreshData=函数（）{
//呼叫路线检查
Restangular.one（'wflowmod'）.get（{proc:procid}）.then（函数（数据）{
//规则类型（“工作流修改器”）
if（data.checktypes&&data.checktypes.length>0）$scope.types.push（{id:'CT'，title:'WFLOWEDIT.OPT1.CT'}）；
if（data.models&&data.models.length>0）$scope.types.push（{id:'MD'，title:'WFLOWEDIT.OPT1.MD'）；
if（data.devicetypes&&data.devicetypes.length>0）$scope.types.push（{id:'DT'，title:'WFLOWEDIT.OPT1.DT'}）；
if（featureFlags.isOn（“configtable”）&&data.configtables&&data.configtables.length>0）$scope.types.push({
id:‘CO’，
标题：“WFLOWEDIT.OPT1.CO”
});
if（data.procedures&&data.procedures.length>0）$scope.types.push（{id:'P'，title:'WFLOWEDIT.OPT1.P'}）；
if（data.steps&&data.steps.length>0）$scope.types.push（{id:'S'，title:'WFLOWEDIT.OPT1.S'）；
if（data.measures&&data.measures.length>0）$scope.types.push（{id:'M'，title:'WFLOWEDIT.OPT1.M'}）；
如果（$scope.types.length<1）$modalInstance.disclose（）；
$scope.newitem.type=$scope.types[0].id；
$scope.resdata=数据；
$scope.updateComboxes（0）；
$scope.wfmods=WorkflowModifyService.getWorkflowModifiersForDisplay（$scope.modifiers）；
$scope.wfmodeditorload=true；
}，AlertService.showserveresterror）
};
$scope.oldType=null；
$scope.oldTrigger=null；
$scope.UPDATECOMBOX=函数（什么）{
log（$scope.types）；
log（$scope.newitem.type）；
//$scope.newitem.type=$scope.newitem.type.id；
如果（！$scope.resdata）返回；
如果（what==0）{
if（$scope.oldType==$scope.newitem.type）返回；
$scope.oldType=$scope.newitem.type；
$scope.codes=\ux.map(
$scope.resdata[{
CT:‘检查类型’，
MD:'模型'，
DT:“设备类型”，
P:‘程序’，
S:‘步骤’，
M：‘措施’，
CO:“配置表”
}[$scope.newitem.type]]，
功能（条目）{
var lang=i18n.getSelectedLanguage（）['code']；
var listitem={}；
如果（条目类型==“字符串”）{
listitem.id=条目；
listitem.title=条目；
}
否则{
//标题将在可用时进行翻译，否则只需设置整个标题（例如configtables）
listitem.id=条目[0]；
listitem.title=条目[0]+“-”+（条目[1][lang]？i18n.translate（条目[1]）：条目[1]）；
}
返回列表项；
}
);
$scope.newitem.code=$scope.code[0].id；
var触发器=[]；
if（u.contains（['CT'，'MD'，'DT']，$scope.newitem.type））{
push（{id:'Select'，title:'WFLOWEDIT.OPT2.SEL'}）；
triggers.push（{id:'！Select'，title:'WFLOWEDIT.OPT2.NSEL'}）；
}
if（u.contains（['CO']，$scope.newitem.type））{
triggers.push（{id:'！Select'，title:'WFLOWEDIT.OPT2.NACTIVE'}）；
push（{id:'Select'，title:'WFLOWEDIT.OPT2.ACTIVE'}）；
}
if（u.contains（['P']，$scope.newitem.type））{
push（{id:'InQueue'，title:'WFLOWEDIT.OPT2.QUEUED'}）；
push（{id:'！InQueue'，title:'WFLOWEDIT.OPT2.NQUEUED'}）；
}
if（u.contains（['P'，'M'，'S']，$scope.newitem.type））{
push（{id:'Pass'，title:'WFLOWEDIT.OPT2.FINPASS'}）；
push（{id:'Fail'，title:'WFLOWEDIT.OPT2.FINFAIL'}）；
push（{id:'Skip'，title:'WFLOWEDIT.OPT2.Skip'}）；
push（{id:'！Skip'，title:'WFLOWEDIT.OPT2.NSKIP'}）；
push（{id:'Omit'，title:'WFLOWEDIT.OPT2.Omit'}）；
push（{id:'！Omit'，title:'WFLOWEDIT.OPT2.NOMIT'}）；
}
if（u.contains（['M']，$scope.newitem.type））{
push（{id:'Yes'，title:'WFLOWEDIT.OPT2.Yes'}）；
push（{id:'No'，title:'WFLOWEDIT.OPT2.No'}）；
}
$scope.triggers=触发器；
$scope.newitem.trigger=$scope.triggers[0].id；
}
if（$scope.oldTrigger==$scope.newitem.trigger）返回；
$scope.oldTrigger=$scope.newitem.trigger；
var resolutions=[{id:'omit'，title:'WFLOWEDIT.OPT3.omit'}]；
如果（！\包含（['Select'，'！Select'，'InQueue'，'！InQueue']，$scope.newitem.trigger））resolutions.push({
id:'跳过'，
标题：“WFLOWEDIT.OPT3.SKIP”
});
$scope.resolutions=决议；
$scope.newitem.res=$scope.resolutions[0].id；
};
$scope.addWorkflowModifier=函数（）{
var newitem={}；
newitem.type=$scope.newitem.type；
newitem.code=$scope.newitem.code；
newitem.res=$scope.newitem.res；
if（$scope.newitem.trigger.substr（0，1）=“！”）{
newitem.trigger=$scope.newitem.trigger.substr（1）；
newitem.inverse

[
  {
    "id": "CT",
    "title": "WFLOWEDIT.OPT1.CT",
    "$$hashKey": "object:114"
  },
  {
    "id": "MD",
    "title": "WFLOWEDIT.OPT1.MD",
    "$$hashKey": "object:115"
  },
  {
    "id": "DT",
    "title": "WFLOWEDIT.OPT1.DT",
    "$$hashKey": "object:116"
  },
  {
    "id": "CO",
    "title": "WFLOWEDIT.OPT1.CO",
    "$$hashKey": "object:117"
  },
  {
    "id": "P",
    "title": "WFLOWEDIT.OPT1.P",
    "$$hashKey": "object:118"
  }
]



{
  "id": "CT",
  "title": "WFLOWEDIT.OPT1.CT",
  "$$hashKey": "object:114"
}



cmod.controller('WorkflowModifierEditorCtrl', function ($rootScope, $scope, $modalInstance, i18n, subtitle, procid, modifiers, Restangular, WorkflowModifyService, AlertService, featureFlags) {
  $scope.modifiers = modifiers;
  $scope.subtitle = subtitle;
  $scope.procid = procid;

  $scope.types = [];
  $scope.codes = [];
  $scope.triggers = [];
  $scope.resolutions = [];

  $scope.newitem = {type: 'CT', code: '', trigger: '', res: ''};

  $scope.refreshData = function () {
    // Calling route CHECK_8
    Restangular.one('wflowmod').get({proc: procid}).then(function (data) {
      // types of rules ("workflow modifiers")
      if (data.checktypes && data.checktypes.length > 0) $scope.types.push({id: 'CT', title: 'WFLOWEDIT.OPT1.CT'});
      if (data.models && data.models.length > 0) $scope.types.push({id: 'MD', title: 'WFLOWEDIT.OPT1.MD'});
      if (data.devicetypes && data.devicetypes.length > 0) $scope.types.push({id: 'DT', title: 'WFLOWEDIT.OPT1.DT'});
      if (featureFlags.isOn("configtable") && data.configtables && data.configtables.length > 0) $scope.types.push({
        id: 'CO',
        title: 'WFLOWEDIT.OPT1.CO'
      });

      if (data.procedures && data.procedures.length > 0) $scope.types.push({id: 'P', title: 'WFLOWEDIT.OPT1.P'});
      if (data.steps && data.steps.length > 0) $scope.types.push({id: 'S', title: 'WFLOWEDIT.OPT1.S'});
      if (data.measures && data.measures.length > 0) $scope.types.push({id: 'M', title: 'WFLOWEDIT.OPT1.M'});
      if ($scope.types.length < 1) $modalInstance.dismiss();
      $scope.newitem.type = $scope.types[0].id;
      $scope.resdata = data;
      $scope.updateComboboxes(0);
      $scope.wfmods = WorkflowModifyService.getWorkflowModifiersForDisplay($scope.modifiers);
      $scope.wfModEditorLoaded = true;
    }, AlertService.showSevereRESTError)
  };

  $scope.oldType = null;
  $scope.oldTrigger = null;

  $scope.updateComboboxes = function (what) {
    console.log($scope.types);
    console.log($scope.newitem.type);
    // $scope.newitem.type = $scope.newitem.type.id;
    if (!$scope.resdata) return;
    if (what == 0) {
      if ($scope.oldType == $scope.newitem.type) return;
      $scope.oldType = $scope.newitem.type;
      $scope.codes = _.map(
        $scope.resdata[{
          CT: 'checktypes',
          MD: 'models',
          DT: 'devicetypes',
          P: 'procedures',
          S: 'steps',
          M: 'measures',
          CO: 'configtables'
        }[$scope.newitem.type]],
        function (entry) {
          var lang = i18n.getSelectedLanguage()['code'];
          var listitem = {};
          if (typeof entry === "string") {
            listitem.id = entry;
            listitem.title = entry;
          }
          else {
            // title will be translated when available, else just set the whole (e.g. configtables)
            listitem.id = entry[0];
            listitem.title = entry[0] + " - " + ( entry[1][lang] ? i18n.translate(entry[1]) : entry[1] );
          }
          return listitem;
        }
      );
      $scope.newitem.code = $scope.codes[0].id;
      var triggers = [];
      if (_.contains(['CT', 'MD', 'DT'], $scope.newitem.type)) {
        triggers.push({id: 'Select', title: 'WFLOWEDIT.OPT2.SEL'});
        triggers.push({id: '!Select', title: 'WFLOWEDIT.OPT2.NSEL'});
      }
      if (_.contains(['CO'], $scope.newitem.type)) {
        triggers.push({id: '!Select', title: 'WFLOWEDIT.OPT2.NACTIVE'});
        triggers.push({id: 'Select', title: 'WFLOWEDIT.OPT2.ACTIVE'});
      }
      if (_.contains(['P'], $scope.newitem.type)) {
        triggers.push({id: 'InQueue', title: 'WFLOWEDIT.OPT2.QUEUED'});
        triggers.push({id: '!InQueue', title: 'WFLOWEDIT.OPT2.NQUEUED'});
      }
      if (_.contains(['P', 'M', 'S'], $scope.newitem.type)) {
        triggers.push({id: 'Pass', title: 'WFLOWEDIT.OPT2.FINPASS'});
        triggers.push({id: 'Fail', title: 'WFLOWEDIT.OPT2.FINFAIL'});
        triggers.push({id: 'Skip', title: 'WFLOWEDIT.OPT2.SKIP'});
        triggers.push({id: '!Skip', title: 'WFLOWEDIT.OPT2.NSKIP'});
        triggers.push({id: 'Omit', title: 'WFLOWEDIT.OPT2.OMIT'});
        triggers.push({id: '!Omit', title: 'WFLOWEDIT.OPT2.NOMIT'});
      }
      if (_.contains(['M'], $scope.newitem.type)) {
        triggers.push({id: 'Yes', title: 'WFLOWEDIT.OPT2.YES'});
        triggers.push({id: 'No', title: 'WFLOWEDIT.OPT2.NO'});
      }
      $scope.triggers = triggers;
      $scope.newitem.trigger = $scope.triggers[0].id;
    }
    if ($scope.oldTrigger == $scope.newitem.trigger) return;
    $scope.oldTrigger = $scope.newitem.trigger;
    var resolutions = [{id: 'omit', title: 'WFLOWEDIT.OPT3.OMIT'}];
    if (!_.contains(['Select', '!Select', 'InQueue', '!InQueue'], $scope.newitem.trigger)) resolutions.push({
      id: 'skip',
      title: 'WFLOWEDIT.OPT3.SKIP'
    });
    $scope.resolutions = resolutions;
    $scope.newitem.res = $scope.resolutions[0].id;
  };

  $scope.addWorkflowModifier = function () {
    var newitem = {};
    newitem.type = $scope.newitem.type;
    newitem.code = $scope.newitem.code;
    newitem.res = $scope.newitem.res;
    if ($scope.newitem.trigger.substr(0, 1) == "!") {
      newitem.trigger = $scope.newitem.trigger.substr(1);
      newitem.inverse = true;
    } else {
      newitem.trigger = $scope.newitem.trigger;
    }
    $scope.modifiers.push(newitem);
    $scope.wfmods = WorkflowModifyService.getWorkflowModifiersForDisplay($scope.modifiers);
  };

  $scope.removeWorkflowModifier = function (idx) {
    var el = $scope.modifiers[idx - 1];
    if (el.type === 'CO') {
      var type = $scope.subtitle.msg.charAt(0).toLowerCase();
      var id = $rootScope.selecteditem.id;
      Restangular.one('configentry', el.code).one('blocker', type).one('id', id).remove().then(function (data) {
        // pass
      }, AlertService.showSevereRESTError);
    }

    $scope.modifiers.splice(idx - 1, 1);
    $scope.wfmods = WorkflowModifyService.getWorkflowModifiersForDisplay($scope.modifiers);
  };

  $scope.refreshData();

  $scope.close = function () {
    $modalInstance.close()
  };
});



<ui-select-choices location="wflowmodify" repeat="item in types | filter: $select.search" refresh-delay="0">



<ui-select-choices location="wflowmodify" repeat="item.id as item in types | filter: $select.search" refresh-delay="0">