Javascript 在Angularjs中，如何使用ng repeat、ng model和ng click动态更改内容？

作为一个例子，我从如下html开始：

<div id="leftSide">

    <div class="item">

        <div class="editor">
            <ul class="choices">
                <li class="choice">This is  choice</li>
            </ul>
            <input class="myChoice" name="myChoice[]" />
        </div>

        <p class="theChoice"></p>

    </div>

    <div class="item">

        <div class="editor">
            <ul class="choices">
                <li class="choice">This is  choice</li>
            </ul>
            <input class="myChoice" name="myChoice[]" />
        </div>

        <p class="theChoice"></p>

    </div>

    <div class="item">

        <div class="editor">
            <ul class="choices">
                <li class="choice">This is  choice</li>
            </ul>
            <input class="myChoice" name="myChoice[]" />
        </div>

        <p class="theChoice"></p>

    </div>

</div>

我已经使用ng repeat循环了三个

.item

div：

<div id="leftSide" ng-controller="leftSide">

    <div class="item" ng-g-repeat="i in getNumber(number) track by $index">

        <div class="editor">
            <ul class="choices">
                <li class="choice">This is  choice</li>
            </ul>
            <input class="myChoice" name="myChoice[]" ng-model="choice1" />
        </div>

        <p class="theChoice">{{choice1}}</p>

    </div>

    ...

</div>

---

我的问题是（显然）选择

.choice'是针对我所有的
ng模型
s，而不是每个与其
.editor
关联的模型。我确信我可以使用
$index
来处理此问题和/或单击ng。我只是有点不知道如何根据
.choice`I select.
来确定正确的目标。我不喜欢jQuery实现，所以我尝试用纯AngularJS来解决您的问题。您可以运行代码段来检查答案：


var-app=angular.module（'my-app'，[]，function（））{
})
app.controller（'AppController'，函数（$scope）{
$scope.number=3；
$scope.choice=[]；
$scope.getNumber=函数（num）{
返回新数组（num）；
}
$scope.choiceClick=函数（i）{
调试器；
$scope.choice[i]=“这是choice”；
}
})


这是选择

{{choice[$index]}
将所选选项作为属性添加到
$scope
中的
对象
中，然后将其添加到hg模型中，如需要，如
obj.selectedchoice.$index
？您的目标是哪里。choice@ArunPJohny：我正在使用一些JS获取
li
的文本，并将其放入
输入中，然后运行
$scope.$apply（）。这就是我认为
ng click
可以解决问题的地方。你能编辑小提琴创建一个更好的演示。。。我知道这是可以做到的！我也不喜欢jQuery实现，但这是我所知道的（lol）。回顾一下，这看起来正是我需要的。当我回家后，我将应用这个概念并测试它。有趣的是，有一次我差点就这样做了：）。如果这是我需要的，我会标记它。
<div id="leftSide" ng-controller="leftSide">

    <div class="item" ng-g-repeat="i in getNumber(number) track by $index">

        <div class="editor">
            <ul class="choices">
                <li class="choice">This is  choice</li>
            </ul>
            <input class="myChoice" name="myChoice[]" ng-model="choice1" />
        </div>

        <p class="theChoice">{{choice1}}</p>

    </div>

    ...

</div>

myApp.controller('leftSide',function($scope,$index){

    //three left boxes
    $scope.number = 3;
    $scope.getNumber = function(num) {
        return new Array(num);   
    }
    ...
});