IONIC 1 和 Angular js 中的范围值未更新

Question

我有一个要求，比如保存两个以前的登录详细信息。 我已经完成了。但是我的视图只会在刷新时更新。但是范围值会更新。

尝试使用scope.apply,digest,timeout。但这里似乎没有任何效果。

$scope.loginUserName=localStorage.getItem("loginUserName");

$scope.userName=localStorage.getItem("userName");
$scope.mobileNumber=localStorage.getItem("mobileNumber");


$scope.loginData = {};

$scope.userLogin = function(loginData) {
userService.userLogin(loginData).then(function(success) {
  var res=success.message;
  if(res==='success'){
    if(localStorage.getItem("userName1")==null || localStorage.getItem("userName1") == success.firstName){
    localStorage.setItem("userName1",success.firstName);
    localStorage.setItem("loginUserName",success.firstName);
    }else if(localStorage.getItem("userName2")==null || localStorage.getItem("userName2") == success.firstName ){
    localStorage.setItem("userName2",success.firstName);
    localStorage.setItem("loginUserName",success.firstName);
    }
    localStorage.setItem("userName",success.firstName);
    $scope.userName=success.firstName;
    $scope.mobileNumber = success.mobileNumber;
    $scope.loginData = {};
    $state.go('app.home');
  }else{
    $scope.message ='Wrong pin.Try again or click Forgot password to reset it.';
  }
},function(error){

});

};

$scope.loginPerson = function(mobileNumber,userName){
localStorage.setItem("loginUserName",userName);
// here userName is updating,but not reflecting in view
$scope.loginUserName=localStorage.getItem("loginUserName");
//setTimeout(function(){ $scope.$apply(); });
console.log("In loginPerson:"+userName);
$state.go('app.start');

}

start.html

 <span ng-if="loginUserName !=null">
      <p class="startP">Enter pin for {{loginUserName}} 
<i class="icon ion-chevron-down" ui-sref="app.loginOptions">
        </i></p>
     </span>

州

  //Here is the state details,I have same controller for two state.

  .state('app.loginOptions', {
  url: '/loginOptions',
  views: {
  'menuContent': {
    templateUrl: 'templates/loginOptions.html',
    controller:'LoginCtrl'
   }
  }
 })

 .state('app.start',{
 url:'/start',
 views:{
  'menuContent':{
    templateUrl:'templates/start.html',
    controller:'LoginCtrl'
   }
 }

编辑

我也在对象内使用过，但没有任何改变。

Answer 1

第 1 步）请在从 localstorage 获取数据到 $scope $scope.xyz=angular.copy(localstorage.get('key')) 时使用 angular copy

在执行步骤 1 之后，在 $scope 中设置值后使用 $scope.$apply(); 不起作用。

Answer 2

尝试使用loginUserName 作为对象的属性，而不是直接使用作用域的属性。有时 angularjs 无法更新这些值的视图。

喜欢

$scope.data={
 loginUserName:""
};

然后在你的函数内部

$scope.userLogin = function(loginData) {
 ...

 $scope.data.loginUserName=localStorage.getItem("loginUserNa‌​me");
// To check it
console.log($scope.data);

}

html

 <span ng-if="data.loginUserName !=null">
  ...
     </span>

更新

如下更改 loginPerson 函数。

$scope.loginPerson = function(mobileNumber,userName){
  localStorage.setItem("loginUserName",userName);

$scope.data.loginUserName=localStorage.getItem("loginUserName");

console.log("In loginPerson:"+userName);
console.log($scope.data);

}