2013-02-27 29 views
12

के अंदर संतोषजनक आइटम का दो प्रकार बाध्यकारी मैं संतुष्ट विशेषता का उपयोग कर फोन की सूची में फ़ोन नाम अपडेट करना चाहता हूं। मैंने एनजी-चेंज का उपयोग करने की कोशिश की है लेकिन इसे निकाल दिया नहीं जा रहा है। क्या कोई और तरीका है इसे करने के लिए?एनजी-सूची

मैं तो अब जब मैं फोन नाम रहा हो वह सूची में अद्यतन करने की जरूरत है संपादित Store.Phones

<ul class="store"> 
    <li ng-repeat="Phone in Store.Phones"> 
    <strong contenteditable> {{Phone.Name}}</strong> 
    </li> 
<ul> 

की एक सूची है।

मैंने तत्व की ओर इशारा करते हुए मॉडल के साथ ऐसा कुछ करने की कोशिश की है। ये काम नहीं कर रहा है।

<strong ng-model='Store.Phones[$index].Name'> {{Phone.Name}}</strong> 

इसके अलावा

<strong ng-model='PhoneName' ng-change='PhoneNameChanged()'> {{Phone.Name}}</strong> 

लेकिन इस मामले विधि निकाल नहीं हो रही है में।

उत्तर

17

संपादित

यहाँ कोणीय डॉक्स जो सिर्फ ng-repeat का उपयोग करता है में उदाहरण के आधार पर एक उदाहरण है। चूंकि ng-repeat प्रत्येक पुनरावृत्ति के लिए एक नया दायरा बनाता है, यह कोई समस्या नहीं होनी चाहिए। http://docs.angularjs.org/guide/forms

यह के अंतर्गत "को लागू करने के लिए कस्टम प्रपत्र नियंत्रण (ngModel का प्रयोग करके)" है हैडर:

<!doctype html> 
<html ng-app="form-example2"> 
<head> 
    <script src="http://code.angularjs.org/1.0.5/angular.min.js"></script> 
    <script> 
    angular.module('form-example2', []).directive('contenteditable', function() { 
     return { 
      require: 'ngModel', 
      link: function(scope, elm, attrs, ctrl) { 
       // view -> model 
       elm.bind('blur', function() { 
        scope.$apply(function() { 
         ctrl.$setViewValue(elm.html()); 
        }); 
       }); 

       // model -> view 
       ctrl.$render = function() { 
        elm.html(ctrl.$viewValue); 
       }; 

       // load init value from DOM 
       ctrl.$setViewValue(elm.html()); 
      } 
     }; 
    }); 
    </script> 
</head> 
<body> 
    <div ng-repeat="i in [1, 2, 3]"> 
     <div contentEditable="true" ng-model="content" title="Click to edit">Some</div> 
     <pre>model = {{content}}</pre> 
    </div> 
    <style type="text/css"> 
    div[contentEditable] { 
     cursor: pointer; 
     background-color: #D0D0D0; 
    } 
    </style> 
</body> 
</html> 

मूल

आप सिर्फ इतना है कि यहाँ कैसे कर सकते हैं का एक उदाहरण नहीं है।

+0

करने के लिए हाँ मैंने देखा है कि लेकिन मैं मुद्दों हो रहा है जब आइटम मैं संपादन कर रहा हूँ एक सूची के अंदर है। – Phani

+0

मैंने एक उदाहरण जोड़ा है जो एनजी-दोहराना का उपयोग करता है। –

+0

धन्यवाद एंडर्स यहां काम कर रहे हैं। आइए, इसकी जांच करते हैं। – Phani