javascript - Angularjs - `ng-model` in multi-dimension array -
i have object:
[{ 'name': '2015', 'section': '001', 'subsections': [{ subsection:'aa', mainelements: ['cc','dd'] },{ subsection:'bb', mainelements: ['ee','ff'] }] }] and can display them in html
<body> <button ng-click="new()">new</button> <ul> <li ng-repeat="audit in audits"> <span ng-hide="editing"><h5>{{audit.name}}</h5></span></br> <input ng-show="editing" type="text" ng-model="audit.name" size="30" placeholder="add name here"></br> <span ng-hide="editing">{{audit.section}}</span></br> <input ng-show="editing" type="text" ng-model="audit.section" size="30" placeholder="add section here"></br> <ul> <li ng-repeat="subsection in audit.subsections"> <span ng-hide="editing">{{subsection.subsection}}</span></br> <input ng-show="editing" type="text" ng-model="subsection.subsection" size="30" placeholder="add subsection here"></br> <ul> <li ng-repeat="mainelement in subsection.mainelements"> <span ng-hide="editing">{{mainelement}}</span></br> <input ng-show="editing" type="text" ng-model="mainelement" size="30" placeholder="add mainelement here"></br> </li> </ul> </li> </ul> <div id="buttons"> <button type="button" ng-hide="editing" ng-click="editing = true">edit</button> <button type="button" ng-show="editing" ng-click="editing = false">save</button> </div> </li> </ul> </body> but problem is, need ng-model dynamic can edit them separately. in case, audit.name , audit.section dynamic. subsection.subsection , main element not.
when this:
$scope.logging = function(i) { var editaudit = $scope.audits[i]; console.log(editaudit.name); console.log(editaudit.section); console.log(editaudit.subsections); console.log(editaudit.subsections.mainelements); } and this
[log] 2015 [log] market map [log] [{subsection: "aa", mainelements: ["cc", "dd"], $$hashkey: "object:9"}, {subsection: "bb", mainelements: ["ee", "ff"], $$hashkey: "object:10"}] [log] undefined - i can
ng-modeldynamic? - how access
mainelementobject inkey-valueform?
update:
i managed elements show up:
<!--html --> <ul> <li class="bitcard" ng-repeat="subsection in audit.subsections"> <span ng-hide="editing">{{audit.subsections[$index].subsection}}</span></br> <input ng-show="editing" type="text" ng-model="audit.subsections[$index].subsection" size="30" placeholder="add subsection here"></br> <ul> <li class="bitcard" ng-repeat="mainelements in audit.subsections[$index].mainelements"> <span ng-hide="editing">{{mainelements}}</span></br> <input ng-show="editing" type="text" ng-model="mainelements" size="30" placeholder="add mainelement here"></br> </li> </ul> </li> </ul> but issue ng-model="mainelements" @ 5th last line not unique. there way have second index $index02 or other alternative ways this?
so have array of subsections , within array of mainelements.
as such need access each item valid index. hence console.log(editaudit.subsections.mainelements); logs out undefined. change console.log(editaudit.subsections[index].mainelements);
and in view can access array items index within ng-repeat. use audit.subsections[$index].subsection instead of subsection.subsection , mainelements[$index] instead of mainelement bind model. not sure mean "get ng-model dynamic" hope gets going.
Comments
Post a Comment