1

我正在使用 angularjs 来集成我的 api。

我在使用ng-if内部文本框时遇到问题。

所以下面是我的 HTML 代码片段：

<input type="text" value="" data-ng-if="edit" ng-model="name">
<input type="text" value="" data-ng-if="!edit" ng-model="singleAppDetails.name">

这里编辑变量在我的控制器中的范围内，我已经这样声明了它：

$scope.edit = false;

因此，如果编辑为假，它应该被绑定，ng-model="name" 如果编辑为真，它应该被绑定，ng-model="singleAppDetails.name" 但它没有按预期绑定它。

此外，我正在使用$http.post将数据发布到服务器，如下所示：

 $scope.addApp = function(){    
       $scope.apps = []; 
        $scope.apps.push({'name':$scope.name, 'domain':$scope.domain, 'appId':$scope.appId, 'secret':$scope.secret});
        // Writing it to the server
        //      
        var dataObj = {
                name : $scope.name,
                domain : $scope.domain,
                appId : $scope.appId,
                secret : $scope.secret
        };  
        var res = $http.post('http://192.168.1.30:8090/apps/', dataObj);
        res.success(function(data, status, headers, config) {
            $scope.message = data;
        });
        res.error(function(data, status, headers, config) {
            alert( "failure message: " + JSON.stringify({data: data}));
        });     
        // Making the fields empty
        //
       $scope.name='';
       $scope.domain='';
       $scope.appId = '';
       $scope.secret = '';
    };

但这总是发送空数据。

4

2 回答 2

2

ng-if有自己的范围。因此，name由第一个输入填充的属性在 ng-if 范围内，而不是在您的控制器范围内。

第二个输入应该可以正常工作，前提是您的控制器将 singleAppDetails 初始化为非空对象：

$scope.singleAppDetails = {};

经验法则：在你的 ng-model 中总是有一个点。始终在作用域中填充对象，而不是作用域本身。

于 2015-04-22T05:53:26.877 回答
2

ng-if正在创建子范围，因为输入元素看不到控制器中定义的范围变量，您有两种方法可以解决此问题

  1. 使用对象引用 ex : $scope.user = { name : "" } 在模板内

    <input type="text" ng-model='user.name' />

  2. 您可以告诉 Angular 在父范围而不是子范围中查找变量

    <input type="text" ng-model='$parent.name' />

于 2017-03-27T07:52:20.470 回答