How to check if an object exist or not in angular js?

Question

Is there any way to know that an object exist or not in HTML. I have an object like this.

$scope.object = {name : 'usman', profession : 'developer'}

Now i want to know in Html if the object exist or not or does the object contain only a text like this .

$scope.object = "Usman";

Now there are my conditions.

    <div ng-if="object">
    <p>Object exist and have attributes</p>
    </div>

    <div ng-if="object">
    <p>object contain only string no attributes exist</p>
   </div>

I want to write a combine condition like this - that if the object has no attributes and contains only string then show the div.

Here it is .

 <div ng-show="!objecthasnoattributes and objectOnlyContainsString">
<p>show this </p>
    </div>

Now how can I do this ?

Sravan · Accepted Answer · 2018-01-05 05:27:14Z

2

It can be more short with a single method:

HTML:

<div ng-if="isObject()">
  <p>Object exist and have attributes</p>
</div>

<div ng-if="!isObject()">
  <p>object contain only string no attributes exist</p>
</div>

Controller:

$scope.isObject = function() {
  return typeof($scope.object) === 'object';
}

UPDATED:

If you want only string to be displayed,

$scope.isString = function() {
  return typeof($scope.object) === 'string';
}

Then you need only one html:

<div ng-if="isString()">
  <p>Show this</p>
</div>

Here is a changed plunk

edited Jan 5, 2018 at 5:27

answered Jan 4, 2018 at 6:58

Sravan

18.7k3 gold badges33 silver badges54 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Usman Iqbal Over a year ago

actually in html I want the condition in one place no seperrate

Sravan Over a year ago

you want only string to be displayed?

Usman Iqbal Over a year ago

see the plunker plnkr.co/edit/XgEPKUL2Fm0I1dclytIV?p=preview and this condition ng-show="$parent.customPopupSelected && $parent.customPopupSelected" play with it

Chintan Joshi · Accepted Answer · 2018-01-04 06:27:14Z

1

You can write as below.

<div ng-if="object !== undefined"> </div>

And to check type of var is OBJECT or STRING... you can do as follow.

    $scope.object = {
        name: 'usman',
        profession: 'developer'
    };

    $scope.myString = "Usman";

    $scope.isString = function(val) {
        return typeof val === 'string';
    }
    $scope.isObject = function(val) {
        return typeof val === 'object';
    }

Then check as below for types.

    <div ng-if="object !== undefined && isObject(object)">
        <p>Object Value </p>
    </div>
    <div ng-if="myString !== undefined && isString(myString)">
        <p>String value</p>
    </div>

Ask for more queries

Thanks

edited Jan 4, 2018 at 6:27

answered Jan 4, 2018 at 5:59

Chintan Joshi

1,3471 gold badge9 silver badges17 bronze badges

1 Comment

Chintan Joshi Over a year ago

See updated Answer. Ask me for more query. Happy to help. :)

Raju · Accepted Answer · 2018-01-04 07:09:06Z

1

You can make much easy way.

$scope.object = {name : 'usman', profession : 'developer'};

$scope.getBType = function(test){
  return( typeof test);
}

<div ng-if="getBType(object)=='object' && getBType(object.name)=='string'">
<p> Show this</p>
</div>

answered Jan 4, 2018 at 7:09

Raju

1602 silver badges10 bronze badges

Comments

pixlboy · Accepted Answer · 2018-01-04 07:20:16Z

0

If you are certain that the input object will be of following types only.

$scope.object = {name : 'usman', profession : 'developer'};

$scope.object = "Usman";

The you can simply use:

<div ng-if="object && object.name">
    <p>Object exist and have attributes</p>
</div>

<div ng-if="object && !object.name">
    <p>object contain only string no attributes exist</p>
</div>

Only if the object exists and has name property, the condition #1 will be met.

answered Jan 4, 2018 at 7:20

pixlboy

1,50213 silver badges30 bronze badges

Collectives™ on Stack Overflow

How to check if an object exist or not in angular js?

4 Answers 4

3 Comments

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

3 Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related