你能幫助解決這個邏輯問題嗎？

Question

exampleDEMO

你可以看到上面的代碼鏈接。

其實我想按鈕組的輸入來控制所有與按鈕組名稱相同的輸入格式。

例如，我把值到輸入表單上的「第一」按鈕右側，

，並在同一時間，所有的輸入形式名稱「第一」的應改變

只按鈕組輸入一個。

對不起，我的英語能力差，希望你能理解它！

<div ng-app="app" ng-controller="AppCtrl"> 
// list group 
    <div> 
    <ul> 
     <li ng-repeat="item in items"> 
     <span>{{item.name}}</span> 
     <input type="text" ng-model="price"> 
     </li> 
    </ul> 
    </div> 


// button group 
    <div> 
    <ul class="list-btn"> 
     <li ng-repeat="btn in btns"> 
     <button>{{btn}}</button> 
     <input type="text" ng-model="price_all">  
     </li> 
    </ul> 
    </div> 
</div> 


angular.module('app', []) 
.controller('AppCtrl', ['$scope', function ($scope) { 
    $scope.items = [ 
    {id: 1, name: 'First'}, 
    {id: 2, name: 'Second'}, 
    {id: 3, name: 'Third'}, 
    {id: 4, name: 'First'}, 
    {id: 5, name: 'Second'}, 
    {id: 6, name: 'Third'}, 
    {id: 7, name: 'First'}, 
    {id: 8, name: 'Second'}, 
    {id: 9, name: 'Third'}, 
    ] 

    $scope.btns = ['First', 'Second', 'Third']; 

}]) 

Answer 1

由於ng模型是insisde li標籤重複的，雙向綁定只能在該li標籤內工作，而不能在其外部使用。所以，你需要使用onkeyup事件。在fiddlder

工作液 - https://jsfiddle.net/fcoLmd2n/

不要在HTML這些變化：

<li ng-repeat="item in items"> 
    <span>{{item.name}}</span> 
    <input type="text" class="{{item.name}}" ng-model="price"> 
    </li> 

<li ng-repeat="btn in btns"> 
    <button>{{btn}}</button> 
    <input type="text" btnType="{{btn}}" ng-model="price_all" onkeyup="Update(this);"> 
</li> 

變化js文件：莫非你

function Update(obj) 
{ 
    var className = obj.getAttribute('btnType'); 
    var txtBoxElements = document.getElementsByClassName(className); 
    for(var i=0;i<txtBoxElements.length;i++) 
    { 
     txtBoxElements[i].value= obj.value 
    } 
} 

使用jQuery優化