AngularJS：ng-show =「user」falsey，ng-show =「!! user」truthy？

Question

我有當前範圍的用戶，由我當前的控制器設置。

$scope.user = user; 

選擇性顯示/隱藏<div>在此基礎上用戶的存在不工作，我所期望的，而不是一個異常被拋出。

不起作用：ng-show="user"

<div class='row' ng-show="user"> 
    ... 
</div> 

作品：ng-show="!!user"

<div class='row' ng-show="!!user"> 
    ... 
</div> 

什麼用ng-show發生導致ng-show="user"不是truthy？

我使用angular.1.2.6從https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js

拋出異常：

如果我使用ng-show="user"，然後我得到了我的控制檯以下異常：

TypeError: Cannot convert object to primitive value 
    at Ma (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js:14:240) 
    at Object.<anonymous> (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js:185:464) 
    at Object.applyFunction [as fn] (<anonymous>:778:50) 
    at h.$digest (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js:99:211) 
    at h.$delegate.__proto__.$digest (<anonymous>:844:31) 
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js:101:256 
    at e (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js:33:182) 
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js:36:378 

這個錯誤會消失，當我使用ng-show="!!user"

用戶對象：

這是user對象，它是在$scope：

{ 
    "state": "", 
    "access_token": "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx", 
    "token_type": "Bearer", 
    "expires_in": "3600", 
    "code": "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx", 
    "scope": "https://www.googleapis.com/auth/plus.login https://www.googleapis.com/auth/userinfo.email https://www.googleapis.com/auth/plus.moments.write https://www.googleapis.com/auth/plus.me https://www.googleapis.com/auth/plus.profile.agerange.read https://www.googleapis.com/auth/plus.profile.language.read https://www.googleapis.com/auth/plus.circles.members.read", 
    "id_token": "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx", 
    "authuser": "0", 
    "session_state": "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx", 
    "prompt": "none", 
    "client_id": "xxxxxxxxxxx.apps.googleusercontent.com", 
    "g_user_cookie_policy": "single_host_origin", 
    "cookie_policy": "single_host_origin", 
    "response_type": "code token id_token gsession", 
    "issued_at": "1391059385", 
    "expires_at": "1391062985", 
    "_aa": "0", 
    "status": { 
    "google_logged_in": true, 
    "signed_in": true, 
    "method": "AUTO" 
    } 
} 

Answer 1

記住ngShow期望一個表達式計算，並會使用該功能「轉換」爲Boolean：

function toBoolean(value) { 
    if (typeof value === 'function') { 
    value = true; 
    } else if (value && value.length !== 0) { 
    var v = lowercase("" + value); 
    value = !(v == 'f' || v == '0' || v == 'false' || v == 'no' || v == 'n' || v == '[]'); 
    } else { 
    value = false; 
    } 
    return value; 
} 

https://github.com/angular/angular.js/blob/834d316829afdd0cc6a680f47d4c9b691edcc989/src/Angular.js#L962

所以，你不應該只使用一個對象。你可以繼續使用!!user或者user.someattr

Answer 2

的!!運算符基本上將JS對象轉換爲布爾值。

看看下面的例子：

function myCtrl($scope) { 
    $scope.user = 'false'; 
    $scope.boolean = !!$scope.user; 
} 

我們創建了一個用戶對象，例如含有字符串錯誤的，它通過調用的布爾表示！運營商。由於$ scope.user的值不爲空，所以!!運算符會將其轉換爲true。然而，angular會將字符串'false'轉換爲布爾值false，從而隱藏div。

我們可以通過以下方式測試：

<div ng-controller="myCtrl"> 
    <div ng-show="boolean"> 
     test boolean 
    </div> 

    <div ng-show="user"> 
     test user 
    </div> 

    <span>{{boolean}}</span> 
</div> 

，它輸出以下內容：

test boolean 
true 

http://jsfiddle.net/FTXn3/

@EDIT

因爲我們正在談論的是用戶對象而不是字符串，正如您接收到的錯誤消息所述ive，!!爲你做轉換爲布爾（=原始）。