Question

我正在创建一个通知应用程序，它将通过电子邮件和短信发送通知。在启动时将设置为true（无法更改json数据）

我创建了切换按钮，它会将每封电子邮件和短信的状态更改为true和false。当将状态更改为true和false时，需要以下面的格式再次发送json数据：

PUT : http://example.url
{
    "category": "Fruit",
    "method": "EMAIL",
    "enabled": true
}

HTML：

<div class="notification-inner-wrap" ng-repeat="settings in pgxNotification.preferences | orderBy:'order'" >
    <p class="notification-heading">{{settings.code}}</p>
    <div ng-repeat="(key, value) in pgxNotification.preferences">
        <div class="notification-methods">
            <span>{{settings.methods[0]}}</span>
            <div class="notification-on-off-icon">
                <i class="fa fa-toggle-on active" ng-if="status == true" ng-click="status = !status"></i>
                <i class="fa fa-toggle-on fa-rotate-180 inactive" ng-if="status == false" ng-click="status = !status"></i>
            </div>
            <pre>{{ status }}</pre>
        </div>
        <div class="notification-methods">
            <span>{{settings.methods[1]}}</span>
            <div class="notification-on-off-icon">
                <i class="fa fa-toggle-on active" ng-if="status == true" ng-click="status = !status"></i>
                <i class="fa fa-toggle-on fa-rotate-180 inactive"  ng-if="status == false" ng-click="status = !status"></i>
            </div>
            <pre>{{ status }}</pre>
        </div>
    </div>
</div>

JS：

app.controller('MainCtrl', function($scope) {
  $scope.status = true;
        $scope.changeStatus = function(status){
            $scope.status = !$scope.status;
            //var method = $scope.pgxNotification.methods[index];

        }


  var response = {
        "status" : true,
        "exception" : null,
        "data": {
            "methods": ["SMS","EMAIL","PUSH"],
            "preferences": [
                {
                    "code": "Fruit",
                    "name": "Fruit content",
                    "methods": ["SMS", "EMAIL"]
                },
                {
                    "code": "Vegetable",
                    "name": "Vegetable content",
                    "methods": ["SMS", "EMAIL"]
                },
                {
                    "code": "Car",
                    "name": "Car content",
                    "methods": ["SMS", "EMAIL"]
                },
                {
                    "code": "bike",
                    "name": "bike content",
                    "methods": ["SMS", "EMAIL"]
                }
            ]
        }
        };
  $scope.pgxNotification = response.data;

});

以下是plunkr：

https://plnkr.co/edit/pIBjao0ujuAzyJGZSPfU?p=preview

现在开关按钮不起作用，需要弄清楚如何以上述格式发送json响应。

在某处，我读到需要使用ng-repeat="(key, value) in pgxNotification.preferences"来设置键值，然后发送json响应。

Answer 1

您正在控制器范围级别使用status变量。因此，任何控件在status上发生的最后更新都将是最终视图值。因此，您没有获得预期的输出。

Here is the updated plunkr

Angularjs：在myObj中使用ng-repeat =“（key，value）”来显示来自json

1 个答案: