ng-show not working angular

Question

I have button that I want to disable when local storage is empty

<button ng-show="LS_wimmtkey!==null">{{LS_wimmtkey}}</button>

Button value shows null, but it is shown, why could that be? I tried writing ng-show="1===2" when it worked correctly, so the problem is with LS_wimmtkey

this is how I use it:

in main.controller.js:

$rootScope.LS_wimmtkey = localStorage.getItem('LS_wimmtkey');
    $rootScope.$watch("LS_wimmtkey", function() {
    localStorage.setItem('LS_wimmtkey', $rootScope.LS_wimmtkey);

My main.view is inserted into the review.view (because form and reviews are on the same page, main is for the review listing and reviews are submitted form)

I add values to local storage after submit in review.controller.js

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);
        $rootScope.LS_wimmtkey = $scope.localArray;
       // $rootScope.localStorageService.set("LS_wimmtkey", $scope.localArray);debugger;
       // $rootScope.LS_wimmtkey= localStorageService.get("LS_wimmtkey"); debugger;


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

I print console.log($rootScope.LS_wimmtkey); and it is null, so why button is not hidden?

@mehulmpt I named my button with the same value and my button title is null, also I print that value in console which also shows it's null — user122222, Jun 27 '17 at 06:13
@Dixit ` ` that worked!!! Thank you so muuuch! Should have thought of that earlier! — user122222, Jun 27 '17 at 06:18
@monikakalt that's technically incorrect. you're then assigning LS_wimmtkey a string value of null instead of actual null somewhere in your code. This might confuse any future developer seeing your code :) — mehulmpt, Jun 27 '17 at 06:19
@mehulmpt what would be correct way to do it then? :) I want to learn the right way — user122222, Jun 27 '17 at 06:21
Look in your code where you're assigning LS_wimmtkey a value of "null" ("null" inside quotes.) get rid of the quotes and your current code would work. I'd also suggest you to read this: https://stackoverflow.com/questions/5076944/what-is-the-difference-between-null-and-undefined-in-javascript — mehulmpt, Jun 27 '17 at 06:23

score 2 · Answer 1 · answered Jun 27 '17 at 06:23

2

yes we cant be check null by LS_wimmtkey!==null probably its string it always return true I'd suggest you:

<button ng-show="LS_wimmtkey">{{LS_wimmtkey}}</button>

try this it will work it will work with undefine null etc...

answered Jun 27 '17 at 06:23

Sumit Jaiswal

787
8
11

score 1 · Accepted Answer · answered Jun 27 '17 at 06:21

1

Try with this null, I think your null as a string, that's technically incorrect but might help you.

<button ng-show="LS_wimmtkey!=='null'">{{LS_wimmtkey}}</button>

answered Jun 27 '17 at 06:21

Dixit

1,359
3
18
39

you can simply do it with `ng-show="LS_wimmtkey"` . You assigning Ls_wimmtkey to null as string – Akashii Jun 27 '17 at 07:04

score 0 · Answer 3 · answered Jun 27 '17 at 11:23

"LS_wimmtkey" belong to $rootScope, please assign this variable to controller scope. because $rootScope does't bing to template.

Fix is:

        $scope.LS_wimmtkey = localStorage.getItem('LS_wimmtkey');
        $rootScope.$watch("LS_wimmtkey", function() {
        localStorage.setItem('LS_wimmtkey', $scope.LS_wimmtkey);

ng-show not working angular

3 Answers3