web-dev-qa-db-ja.com

配列AngularJSに値をプッシュします

.Push();を使用してAngularJSの配列にデータ値をプッシュしようとしていますが、常に次のエラーメッセージが表示されます。

Error: $scope.test.Push is not a function

これが私のHTMLです:

<div ng-controller="Test">
<div class="container">
<div class="col-sm-9 col-sm-offset-2">

    <div class="page-header"><h1>Testar</h1></div>
    <table class="table table-striped table-condensed">
    <thead>
        <tr>
            <th>Sträcka</th>
            <th>Tid</th>
         </tr>
    </thead>
        <tr ng-repeat="info in test"><td>{{info.stracka}}</td><td>{{info.tid}}</td></tr>
    </table>

    <form name="userForm" ng-submit="submitForm(userForm.$valid)" novalidate> <!-- novalidate prevents HTML5 validation since we will be validating ourselves -->
        <div class="form-group" ng-class="{'has-error' : userForm.stracka.$invalid && !userForm.stracka.$pristine, 'has-success' : userForm.stracka.$valid }">
            <label>Sträcka(m):</label>
            <input type="text" name="stracka" class="form-control" ng-model="form.stracka" required>
            <p ng-show="userForm.stracka.$invalid && !userForm.stracka.$pristine" class="help-block">Fel sträcka</p>
        </div>

        <div class="form-group" ng-class="{'has-error' : userForm.tid.$invalid && !userForm.tid.$pristine, 'has-success' : userForm.tid.$valid && !userForm.tid.$pristine}">
            <label>Tid:</label>
            <input type="text" name="tid" class="form-control" ng-model="form.tid" ng-minlength="3" ng-maxlength="8">
            <p ng-show="userForm.tid.$error.minlength" class="help-block">För kort</p>
            <p ng-show="userForm.tid.$error.maxlength" class="help-block">För långt</p>

        </div>
        <button type="submit" class="btn btn-primary">Lägg till</button>
    </form>
</div>
</div>
</div>

そして、これが私のコントローラーです:

as.controller('Test', function($scope, $http, $rootScope, testFactory)
{   

    $http.get($rootScope.appUrl + '/nao/test/test')
        .success(function(data, status, headers, config) {
            $scope.test = data.data;
    });

    $scope.form = {};

    $scope.submitForm = function(isValid) {
        if(isValid) 
        {   
            /*testFactory.testFactoryMethod(function($http) {
                $scope.test = data;
            });*/
            $http.post($rootScope.appUrl + '/nao/test', $scope.form)
            .success(function(data, status, headers, config) {
                console.log(data);
                $scope.test.Push($scope.form);

            }).error(function(data, status) {

            });
        }
    };
});

誰かが私を助けて、なぜ私がこのメッセージを受け取るのか説明できますか?

5
user500468

これを試してください:

$scope.test = [];
$scope.test.Push($scope.form);
9
ThomasP1988

これを試して:

as.controller('Test', function($scope, $http, $rootScope, testFactory)
{   

    $http.get($rootScope.appUrl + '/nao/test/test')
        .success(function(data, status, headers, config) {
            $scope.test = data.data;
    });

    $scope.form = {};

    $scope.submitForm = function(isValid) {
        if(isValid) 
        {   
            /*testFactory.testFactoryMethod(function($http) {
                $scope.test = data;
            });*/

            $http.post($rootScope.appUrl + '/nao/test', $scope.form)
            .success(function(data, status, headers, config) {
                console.log(data);
                $scope.test = $scope.test || []; 
                $scope.test.Push($scope.form);

            }).error(function(data, status) {

            });
        }
    };
});
2
Amir Popovich

最初に配列を作成します-_$scope.usermsg = [];_

次に値をプッシュします-$scope.usermsg.Push($variable);

1
partho222