我必須刷新AngularJS頁面才能看到我的更改

Question

我必須刷新頁面才能看到更改，Angular是雙向綁定，但是對於我的問題看來它的行為像單向一樣。 從1小時前開始，我一直在嘗試解決此問題，但找不到任何解決方案。

index.html

<div ng-controller="tweetController as tweet">
            <form>  <!-- USERNAME INPUT -->
                <div class="form-group">
                    <label>Title</label>
                    <input type="text" class="form-control" ng-model="tweet.tweetData.title">
                </div>

                <!-- PASSWORD INPUT -->
                <div class="form-group">
                    <label>Tweet Content</label>
                    <input type="text" class="form-control" ng-model="tweet.tweetData.content">
                </div>

                <!-- LOGIN BUTTON -->
                <button ng-click= "tweet.createTweet()" type="submit" class="btn btn-block btn-primary">
                    <span>Create Tweet</span>
                </button>

        </form>

        <tr ng-repeat="tw in tweet.tweets">
                    <td>{{ tw._id }}</td>
                    <td>{{ tw.title }}</td>
                    <td>{{ tw.content }}</td>                   
        </tr>

    </div>

tweetCtrl.js

angular.module('tweetCtrl', ['tweetService'])

.controller('tweetController', function(Tweet) {

    var vm = this;

    Tweet.all()
        .success(function(data) {
            vm.tweets = data;
        });


    vm.createTweet = function() {
        vm.processing = true;

        vm.message = '';

        Tweet.create(vm.tweetData) 
            .success(function(data) {
                vm.processing = false;

                // clear the form
                vm.tweetData = {}
                vm.message = data.message;
            });
    };

});

service.js

angular.module('tweetService', [])


.factory('Tweet', function($http) {

    // get all approach
    var tweetFactory = {};

    tweetFactory.all = function() {
        return $http.get('/api/');
    }


    tweetFactory.create = function(tweetData) {
        return $http.post('/api/', tweetData);
    }

    return tweetFactory;

});

Answer 1

您需要將新的tweet送到您的tweets文集-不會自動更新。 據我所知，您只能在頁面加載時調用.all() ，因此只需在create完成后將其壓入數組即可：

vm.createTweet = function() {
    vm.processing = true;

    vm.message = '';

    Tweet.create(vm.tweetData) 
        .success(function(data) {
            vm.processing = false;

            // clear the form
            vm.tweetData = {}
            vm.message = data.message;

            //show the new tweet in the view
            vm.tweets.push(data); //assuming "data" is the returned tweet
        });
};