如何在使用 ng-options 时将所选选项的文本分配给另一个模型? [英] How to assign selected option's text to another model while using ng-options?

问题描述

我可以创建一个选择标签并将数据放入其中.我可以将该选择的选定选项分配给一个模型，但不能将其文本分配给另一个模型.

这是下面的示例和 jsFiddle 链接

html:

<div ng-controller="DemoCtrl"><select ng-model="customerId" ng-options="item.id as item.name for item in content" ng-change="customerName = item.name"></选择><br/><input disabled="disabled" type="text" ng-model="customerId"/><input disabled="disabled" type="text" ng-model="customerName"/><!-- 我正在尝试获取客户名称并将其分配给我的模型-->

js:

function DemoCtrl($scope) {$scope.content = [{name: "Bireysel",编号:1},{name: "库鲁姆萨尔",编号:2},{name: "Bireysel & Kurumsal",编号:3}];}

解决方案

请看下面的演示在选择将您的模型更改为 cutomer 并在输入中使用 customer.id customer.name

function DemoCtrl($scope) {$scope.content = [{name: "Bireysel",编号:1}, {name: "库鲁姆萨尔",编号:2}, {name: "Bireysel & Kurumsal",编号:3}];}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script><div ng-app><div ng-controller="DemoCtrl"><select ng-model="customer" ng-options="item as item.name for item in content" ng-change="customerName = item.name"></选择><br/><input disabled="disabled" type="text" ng-model="customer.id"/><input disabled="disabled" type="text" ng-model="customer.name"/>

I can create a select tag and place data inside it. I can assign that select's selected option to a model but can't assign its text to another model.

Here is example below and jsFiddle link

html:

<div ng-app>
  <div ng-controller="DemoCtrl">
      <select ng-model="customerId" ng-options="item.id as item.name for item in content" ng-change="customerName = item.name">
</select>
      <br/>
      <input disabled="disabled" type="text" ng-model="customerId"/>
      <input disabled="disabled" type="text" ng-model="customerName"/>
      <!-- i'm trying to get customer name and assign that on to my model -->
  </div>
</div>

js:

function DemoCtrl($scope) {
  $scope.content = [
    {
        name: "Bireysel",
        id: 1
    },
    {
        name: "Kurumsal",
        id: 2
    },
    {
        name: "Bireysel & Kurumsal",
        id: 3
    }];

}

解决方案

Please see demo below In select change your model to cutomer and in inputs use customer.id customer.name

function DemoCtrl($scope) {
  $scope.content = [{
    name: "Bireysel",
    id: 1
  }, {
    name: "Kurumsal",
    id: 2
  }, {
    name: "Bireysel & Kurumsal",
    id: 3
  }];

}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app>
  <div ng-controller="DemoCtrl">
    <select ng-model="customer" ng-options="item as item.name for item in content" ng-change="customerName = item.name">
    </select>

    <br/>
    <input disabled="disabled" type="text" ng-model="customer.id" />
    <input disabled="disabled" type="text" ng-model="customer.name" />
  </div>
</div>

这篇关于如何在使用 ng-options 时将所选选项的文本分配给另一个模型?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！