Using ngIf in angular but I am getting Bindings cannot contain assignments

1

reservedcoders: ReservedCoders;

export class ReservedCoders{

    constructor(

        public coderID:number

    ){ }

}

mycoder is an array

<td>

<div *ngIf="reservedcoders.find(s => s.coderID == mycoder.svUserID); else notEqual">

<button type="button" (click)="releasePopUp(mycoder.svUserID,mycoder.name)" class="btn btn-primary">Release</button>&nbsp;

<button type="button" (click)="addAdditionalPopUp(mycoder.svUserID,mycoder.name)" class="btn btn-primary">Add 10%</button>

</div>

<ng-template #notEqual>

<button type="button" (click)="releasePopUp(mycoder.svUserID,mycoder.name)" disabled class="btn btn-primary">Release</button>&nbsp;

<button type="button" (click)="addAdditionalPopUp(mycoder.svUserID,mycoder.name)" disabled class="btn btn-primary">Add 10%</button>

</ng-template>

</td>

angular

share|improve this question

edited Jan 2 at 2:46

Dale Burrell

3,35652655

asked Jan 2 at 2:45

AnushaAnusha

82

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  what's with the else notEqual in the ngIf here? ngIf already checks for undefined, it doesn't need an alternate state for the find code.....
  
  – Claies
  Jan 2 at 4:11
  

  
  
  
  

add a comment | 

1

reservedcoders: ReservedCoders;

export class ReservedCoders{

    constructor(

        public coderID:number

    ){ }

}

mycoder is an array

<td>

<div *ngIf="reservedcoders.find(s => s.coderID == mycoder.svUserID); else notEqual">

<button type="button" (click)="releasePopUp(mycoder.svUserID,mycoder.name)" class="btn btn-primary">Release</button>&nbsp;

<button type="button" (click)="addAdditionalPopUp(mycoder.svUserID,mycoder.name)" class="btn btn-primary">Add 10%</button>

</div>

<ng-template #notEqual>

<button type="button" (click)="releasePopUp(mycoder.svUserID,mycoder.name)" disabled class="btn btn-primary">Release</button>&nbsp;

<button type="button" (click)="addAdditionalPopUp(mycoder.svUserID,mycoder.name)" disabled class="btn btn-primary">Add 10%</button>

</ng-template>

</td>

angular

share|improve this question

edited Jan 2 at 2:46

Dale Burrell

3,35652655

asked Jan 2 at 2:45

AnushaAnusha

82

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  what's with the else notEqual in the ngIf here? ngIf already checks for undefined, it doesn't need an alternate state for the find code.....
  
  – Claies
  Jan 2 at 4:11
  

  
  
  
  

add a comment | 

1

1

1

reservedcoders: ReservedCoders;

export class ReservedCoders{

    constructor(

        public coderID:number

    ){ }

}

mycoder is an array

<td>

<div *ngIf="reservedcoders.find(s => s.coderID == mycoder.svUserID); else notEqual">

<button type="button" (click)="releasePopUp(mycoder.svUserID,mycoder.name)" class="btn btn-primary">Release</button>&nbsp;

<button type="button" (click)="addAdditionalPopUp(mycoder.svUserID,mycoder.name)" class="btn btn-primary">Add 10%</button>

</div>

<ng-template #notEqual>

<button type="button" (click)="releasePopUp(mycoder.svUserID,mycoder.name)" disabled class="btn btn-primary">Release</button>&nbsp;

<button type="button" (click)="addAdditionalPopUp(mycoder.svUserID,mycoder.name)" disabled class="btn btn-primary">Add 10%</button>

</ng-template>

</td>

angular

share|improve this question

edited Jan 2 at 2:46

Dale Burrell

3,35652655

asked Jan 2 at 2:45

AnushaAnusha

82

reservedcoders: ReservedCoders;

export class ReservedCoders{

    constructor(

        public coderID:number

    ){ }

}

mycoder is an array

<td>

<div *ngIf="reservedcoders.find(s => s.coderID == mycoder.svUserID); else notEqual">

<button type="button" (click)="releasePopUp(mycoder.svUserID,mycoder.name)" class="btn btn-primary">Release</button>&nbsp;

<button type="button" (click)="addAdditionalPopUp(mycoder.svUserID,mycoder.name)" class="btn btn-primary">Add 10%</button>

</div>

<ng-template #notEqual>

<button type="button" (click)="releasePopUp(mycoder.svUserID,mycoder.name)" disabled class="btn btn-primary">Release</button>&nbsp;

<button type="button" (click)="addAdditionalPopUp(mycoder.svUserID,mycoder.name)" disabled class="btn btn-primary">Add 10%</button>

</ng-template>

</td>

angular

angular

share|improve this question

edited Jan 2 at 2:46

Dale Burrell

3,35652655

asked Jan 2 at 2:45

AnushaAnusha

82

share|improve this question

edited Jan 2 at 2:46

Dale Burrell

3,35652655

asked Jan 2 at 2:45

AnushaAnusha

82

share|improve this question

share|improve this question

edited Jan 2 at 2:46

Dale Burrell

3,35652655

edited Jan 2 at 2:46

Dale Burrell

3,35652655

edited Jan 2 at 2:46

Dale Burrell

3,35652655

3,35652655

asked Jan 2 at 2:45

AnushaAnusha

82

asked Jan 2 at 2:45

AnushaAnusha

82

asked Jan 2 at 2:45

AnushaAnusha

82

82

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  what's with the else notEqual in the ngIf here? ngIf already checks for undefined, it doesn't need an alternate state for the find code.....
  
  – Claies
  Jan 2 at 4:11
  

  
  
  
  

add a comment | 

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  what's with the else notEqual in the ngIf here? ngIf already checks for undefined, it doesn't need an alternate state for the find code.....
  
  – Claies
  Jan 2 at 4:11
  

  
  
  
  

what's with the else notEqual in the ngIf here? ngIf already checks for undefined, it doesn't need an alternate state for the find code.....

– Claies
Jan 2 at 4:11

what's with the else notEqual in the ngIf here? ngIf already checks for undefined, it doesn't need an alternate state for the find code.....

– Claies
Jan 2 at 4:11

add a comment | 

1 Answer
1

active

oldest

votes

0

I'm not sure what the exact problem is, but I have found in the past that somewhat complex expressions do often fail in *ngIf bindings.

The likely best solution is to modify your code to call a simple method in your component, and implement the "find" in that method.

So, for instance, implement this in your component:

public coderIdIsReserved(): boolean {

  return this.reservedcoders.find(s => s.coderID === mycoder.svUserID) ;

}

and change your template to:

<div *ngIf="coderIdIsReserved(); else notEqual">

share|improve this answer

answered Jan 2 at 4:00

GreyBeardedGeekGreyBeardedGeek

21.2k13047

add a comment | 

Your Answer

StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});


}
});

Thanks for contributing an answer to Stack Overflow!

• Please be sure to answer the question. Provide details and share your research!

But avoid …

• Asking for help, clarification, or responding to other answers.


• Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54000655%2fusing-ngif-in-angular-but-i-am-getting-bindings-cannot-contain-assignments%23new-answer', 'question_page');
}
);

Post as a guest

Name

Email

Required, but never shown

1 Answer
1

active

oldest

votes

1 Answer
1

active

oldest

votes

active

oldest

votes

active

oldest

votes

0

I'm not sure what the exact problem is, but I have found in the past that somewhat complex expressions do often fail in *ngIf bindings.

The likely best solution is to modify your code to call a simple method in your component, and implement the "find" in that method.

So, for instance, implement this in your component:

public coderIdIsReserved(): boolean {

  return this.reservedcoders.find(s => s.coderID === mycoder.svUserID) ;

}

and change your template to:

<div *ngIf="coderIdIsReserved(); else notEqual">

share|improve this answer

answered Jan 2 at 4:00

GreyBeardedGeekGreyBeardedGeek

21.2k13047

add a comment | 

0

I'm not sure what the exact problem is, but I have found in the past that somewhat complex expressions do often fail in *ngIf bindings.

The likely best solution is to modify your code to call a simple method in your component, and implement the "find" in that method.

So, for instance, implement this in your component:

public coderIdIsReserved(): boolean {

  return this.reservedcoders.find(s => s.coderID === mycoder.svUserID) ;

}

and change your template to:

<div *ngIf="coderIdIsReserved(); else notEqual">

share|improve this answer

answered Jan 2 at 4:00

GreyBeardedGeekGreyBeardedGeek

21.2k13047

add a comment | 

0

0

0

I'm not sure what the exact problem is, but I have found in the past that somewhat complex expressions do often fail in *ngIf bindings.

The likely best solution is to modify your code to call a simple method in your component, and implement the "find" in that method.

So, for instance, implement this in your component:

public coderIdIsReserved(): boolean {

  return this.reservedcoders.find(s => s.coderID === mycoder.svUserID) ;

}

and change your template to:

<div *ngIf="coderIdIsReserved(); else notEqual">

share|improve this answer

answered Jan 2 at 4:00

GreyBeardedGeekGreyBeardedGeek

21.2k13047

I'm not sure what the exact problem is, but I have found in the past that somewhat complex expressions do often fail in *ngIf bindings.

The likely best solution is to modify your code to call a simple method in your component, and implement the "find" in that method.

So, for instance, implement this in your component:

public coderIdIsReserved(): boolean {

  return this.reservedcoders.find(s => s.coderID === mycoder.svUserID) ;

}

and change your template to:

<div *ngIf="coderIdIsReserved(); else notEqual">

share|improve this answer

answered Jan 2 at 4:00

GreyBeardedGeekGreyBeardedGeek

21.2k13047

share|improve this answer

share|improve this answer

answered Jan 2 at 4:00

GreyBeardedGeekGreyBeardedGeek

21.2k13047

answered Jan 2 at 4:00

GreyBeardedGeekGreyBeardedGeek

21.2k13047

answered Jan 2 at 4:00

GreyBeardedGeekGreyBeardedGeek

21.2k13047

21.2k13047

add a comment | 

add a comment | 

Thanks for contributing an answer to Stack Overflow!

• Please be sure to answer the question. Provide details and share your research!

But avoid …

• Asking for help, clarification, or responding to other answers.


• Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Thanks for contributing an answer to Stack Overflow!

• Please be sure to answer the question. Provide details and share your research!

But avoid …

• Asking for help, clarification, or responding to other answers.


• Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54000655%2fusing-ngif-in-angular-but-i-am-getting-bindings-cannot-contain-assignments%23new-answer', 'question_page');
}
);

Post as a guest

Name

Email

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name

Email

Required, but never shown

Name

Name

Email

Required, but never shown

Email

Required, but never shown

Email

Required, but never shown

Email

Required, but never shown

Name

Name

Email

Required, but never shown

Email

Required, but never shown

Email

Required, but never shown

Email

Required, but never shown

This page is only for reference, If you need detailed information, please check here