刷新

时间:2017-06-27 07:42:45

标签: javascript angularjs

无论我做什么,我都无法让它发挥作用。一直坐着几个小时都没有。提交表单后,我创建值名称,姓氏,电子邮件的本地存储,以便我可以使用它们填写表单,以便用户不必每次都键入它们。 submit()位于review.controller.js

(function(){     '使用严格的';

angular.module('app').controller('ReviewController', ReviewController);

ReviewController.$inject = ['$location', 'AuthenticationService', 'FlashService', 'UniversalService', '$scope', '$sce', '$rootScope','$route','$cookies','localStorageService'];
function ReviewController($location, AuthenticationService, FlashService, UniversalService, $scope, $sce, $rootScope,$route,$cookies,localStorageService) {
   var vm = this;
    vm.name = null;
    vm.surname = null;
    vm.Email = null;
    vm.review = null;
    vm.allgenres = [];
    vm.submit = submit;
    vm.allreviews = [];
    $scope.localArray=[];
    loadAllReviews();
    submit();

    $scope.templates = [{ name: 'man.main.view.html', url: 'main/main.view.html'}];
    $scope.template = $scope.templates[0];

    function loadAllReviews() {      
        UniversalService.GetAllReviews()
            .then(function (review) {
                vm.allreviews = review;                    
            });
    }

    $scope.init = function () {debugger;
       // $scope.$MainController.obtained_array = localStorage.getItem("storageKey");debugger;
        $scope.storageKey = localStorage.getItem("storageKey");debugger;
    };

    $scope.storageKey = localStorage.getItem('storageKey');

  /*  $scope.$watch("storageKey", function() {debugger;
        localStorage.setItem('storageKey', storageKey); 
    });*/


    function submit() {  
    if($rootScope.name!=null)    {
        var JSONObject = {
             "name":$rootScope.name,
             "surname":$rootScope.surname,
             "email":$rootScope.email,
             "review":$rootScope.review
            }
        var temp={
            "name":$rootScope.name,
             "surname":$rootScope.surname,
             "email":$rootScope.email
        }
        $scope.localArray.push(temp);

        localStorageService.set("storageKey", $scope.localArray);

        $scope.storageKey = localStorageService.get("storageKey"); 
       // $rootScope.obtained_array = localStorageService.get("storageKey"); debugger;

        console.log($scope.storageKey);debugger;

        var Results = UniversalService.PostReview(JSON.stringify(JSONObject));
        }
    }
}

main.controller.js

'use strict';

var app = angular.module(' app')。controller(' MainController',MainController);

MainController.$inject = ['$location', 'AuthenticationService', 'FlashService', 'UniversalService', '$scope', '$sce', '$rootScope','$log','PagerService','localStorageService','$mdDialog'];
function MainController($location, AuthenticationService, FlashService, UniversalService, $scope, $sce, $rootScope,$log,PagerService,localStorageService,$mdDialog) {
   var vm = this;
    vm.allreviews = [];
    vm.allusers=[];
    vm.allemails=[];
    vm.all=[];
    vm.avatars=[];
    $scope.filteredAll = [];
    $scope.all=[];
    $scope.items=[];

    $scope.pager = {};
    $scope.setPage = setPage;

    loadAllReviews();
    loadAllEmails();
    loadAllUsers();
    loadAll();
    loadAvatars();
    initController();
    setPage();
    submit();

    $scope.init = function () {
        $scope.$parent.storageKey = localStorage.getItem("storageKey");debugger;
       // $scope.obtained_array = localStorage.getItem("storageKey");
       // console.log(obtained_array); debugger;
       // $scope.storageKey = localStorage.getItem("storageKey");debugger;
    };


    function refresh() {
        location.reload();debugger;
    }


    function loadAll() {
        UniversalService.GetAll()
            .then(function (a) {
                $scope.all=a;
            });
    }

     function loadAllUsers(callback) {      
        UniversalService.GetAll()
            .then(function (response) {
                $scope.users=response;
                if (callback) {
                    callback(response);
                }
            });
    }

    function loadAllReviews() {      
        UniversalService.GetAllReviews()
            .then(function (review) {
                vm.allreviews = review;
            });
    }

    function loadAllEmails() {      
        UniversalService.GetAllEmails()
            .then(function (email) {
                vm.allemails = email;
            });
    }

    function setPage(page) {
        loadAllUsers(function (response) {
            if (response) {
                if (page < 1 || page > $scope.pager.totalPages) {
                    return;
            }
            // get pager object from service
            $scope.everything=response;
            $scope.pager = PagerService.GetPager(response.length, page);
            // get current page of items
            $scope.items = response.slice($scope.pager.startIndex, $scope.pager.endIndex + 1); 
            } 
        });
    }



    function initController() {
        $scope.setPage(1);  // initialize to page 1
    }

}

HTML文件:

<div class="container padding-tb" id="Review">
<div ng-controller="ReviewController" ng-init="init()" ng-app id="Review">

<h2>Add review</h2>
    <form name="form" ng-submit="vm.submit()" role="form">
        <div >
            <div>
                <div class="form-group">
                    <label for="name">Name</label>
                    <input type="text" name="text" ng-model="name" onchange="CallItems()" id="name" class="form-control" ng-model="vm.name" placeholder="Enter name here"  required />
                    <span ng-show="form.name.$dirty && form.name.$error.required" class="help-block">Name is required</span>
                </div>
            </div>

            <div>
                <div class="form-group">
                    <label for="surname">Surname</label>
                    <input type="text" ng-model="surname" name="text" id="surname" class="form-control" ng-model="vm.surname" placeholder="Enter surname here"  required/>
                    <span ng-show="form.surname.$dirty && form.surname.$error.required" class="help-block">Surname is required</span>
                </div>
            </div>

             <div>
                <div class="form-group">
                    <label for="email">Email</label>
                    <input type="text" name="email" id="email" class="form-control" ng-model="vm.email" placeholder="Enter email here" required />
                    <span ng-show="form.email.$dirty && form.email.$error.required" class="help-block">Email is required</span>
                </div>
            </div>

            <div>
                <div class="form-group">
                    <label for="review">Review</label>
                    <input type="text" name="text" id="review" class="form-control" ng-model="vm.review" placeholder="Enter review here"  required/>
                    <span ng-show="form.review.$dirty && form.review.$error.required" class="help-block">Review is required</span>
                </div>
            </div>

           <div class="form-actions">
                <button id="submit" type="submit" onclick="passInfo()" class="btn btn-primary">Submit</button>

                <label style="display:none" id="label"><font color="white">Review succesfully created!  

                <a onclick="refresh()" href="../ang/#!/review">Add new review</a></label> or 
                <a href="../ang/#!/">View reviews!</a>


            </div>
        </div>

    </form>

    <div>

        <div ng-init="init()" class="slide-animate-container">
        <div class="slide-animate" ng-include="main.view.html"></div>
        </div>
    </div>
</div>

目前,我将这些值添加到按钮以测试是否添加了值:

<button ng-disabled="localStorage.getItem('LS_wimmtkey') !== null"> {{obtained_array}}</button>

我的main.view被插入到review.view中(因为表单和评论在同一页面上,主要是评论列表和评论提交表单)

提交表单后,所有这些值都会出现在按钮中,但在刷新页面后,它们都不再显示。我有点明白,这完全是因为我对本地存储的所有操作都在submit()函数内,但我不知道如何解决它

2 个答案:

答案 0 :(得分:0)

您可以在第二个控制器上编写init函数,并在变量中设置本地存储值。每当刷新页面时,将调用init函数并且可以使用本地存储值你可以在View

中使用它

答案 1 :(得分:0)

见下面一行:

<button ng-disabled="localStorage.getItem('LS_wimmtkey') !== null"> {{obtained_array}}</button>

&#34; obtained_array&#34;属于$ rootScope,因此$ rootScope无法绑定到模板(无法绑定到$ rootScope)

快速解决方案是:更改以下行 如果: MainController

$scope.obtained_array = localStorage.getItem("LS_wimmtkey");debugger;

以下情况: ReviewController (您在此ctrl&#34; LS_wimmtkey&#34;中设置)

$scope.$parent.obtained_array = localStorage.getItem("LS_wimmtkey");debugger;