Angular HTML binding

I am writing an Angular application and I have an HTML response I want to display. How do I do that? If I simply use the binding syntax {{myVal}} it encodes all HTML characters (of course). I need...

Angular 2 two way binding using ngModel is not working

Can't bind to 'ngModel' since it isn't a know property of the 'input' element and there are no matching directives with a corresponding property Note: im using alpha.31 import { Component, View,...

Bidirectional data binding on a component input property

I am trying to make something work on angular2 and I am unable to find something about this behavior. I have an application that implements a custom component like this one : import...

Why is two-way databinding in AngularJS an antipattern?

AngularJS offers two-way databinding. I built several AngularJS apps and found two-way databinding to be a powerful feature, that increased my productivity. Recently however I come more and more...

Angular2 - two way databinding on a component variable / component class property?

In Angular2 (Beta 6) I have a component for a main menu. <mainmenu></mainmenu> I want to bind a boolean for wide or narrow. So I made it into this: <mainmenu...

Function is getting called many times by using template interpolation?

Sorry for basic question, I am trying to understand the angular2 flow using basic example. import { Component } from '@angular/core'; @Component({ selector:'my-app', template:'Test {{...

How to Keep Change Detection Alive While Passing an User-defined "Query"-Object to a Pipe instead of a String (Angular 2)?

(TL;DR: Summary of questions is found below) I have a large data set which I want to filter using multiple criteria. It's all working nicely however I had to do some nasty things which I want to...

ExpressionChangedAfterItHasBeenCheckedError Explained

Please explain to me why I keep getting this error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Obviously, I only get it in dev mode, it doesn't...

without using form for validation How can I disabled a button in angular if <input> field is empty

I am trying to do @output in angular for that I have an input field with a button, I will send input's field data to parent by using @output() I want to disabled a button if the input field is...

Angular2: Can I process @Output return value with arrow function instead of method

I have an Angular2 app which has a parent component (AppComponent) and several child components. One of them (DnDContainer) has an @Output variable like this: @Output() onDataUpdate:...

toggle checkbox Angular 2

Hi am using angular 2 data-table in my project. my tbody: <tbody> <tr *ngFor="let item of main.data; let ndx = index"> <td> <mfRowSelector [checkboxId]="ndx" ...

Data Binding causes ExpressionChangedAfterItHasBeenCheckedError

I'm new to Angular 4. I have a data binding field like below. But somehow, there is an ExpressionChangedAfterItHasBeenCheckedError. <form> <div> <h2>Hello {{input.value}}</h2> <input...

even though pagination works for the datatable but angular2-datatable not displaying data

I am getting the response as an array of size 9 from one rest service, and that response I am assigning to angular2-datatable [mfData] property. On button click I am opening one modal and inside...

How to loop through an object and push into an array

What I'm working with angular2 firebase What I have A returned object Each item in the object has a URL property What I would like to do Loop through each of the items in the object and get...

A object change to undefined?

product.service.ts: import { Injectable } from '@angular/core'; import { Http, Response } from '@angular/http'; import { Observable } from "rxjs/Observable"; import...

Why passing custom object in @Input doesn't work?

I am trying to pass a custom object through @Input. But, I'm getting null as output. This is my child component class: import { Component, OnInit, Input } from '@angular/core'; import { Element }...

Angular 4 view is not updating when model is changed

I have an Angular 4 component that retrieves data from a service and then updates a view. When my service retrieves the data and updates the component's property, the property does not update in...

Angular textarea data binding

I am able to bind the data from a textarea on to the page whilst typing but how am I able to get the returns placed in the textarea? My current code is:- app.component.html <div class="ui center...

Angular2 one way databinding in input field

Very simple, I have a component containing a string I need to show this string in an input field. I thought I need it like this but it doesn't work. import {Component} from...

How can I bind 2 variables inside 1 property binding in angular 2?

I'm trying to dynamically generate and use form controls from my json data. A simple experiment I came up with to figure out the mechanics I need to apply goes as follows. variables defined in...

Angular - Is binding a component method to DOM target property a wrong practice?

Say, I have a component which is used as following: <health-renderer [health]="getHealth()" [label]="label"> <health-renderer> After reading data-binding related parts from...

Can an object be notified when a component object changes in Angular 2/4?

In Angular, a component can receive as @Input() a variable or object. Whenever the variable changes, Angular notifies the component. Very cool... I'm trying to build an app that shows a ng2-tree...

Angular Tutorial: Tour of Heroes lesson 2: data binding to hero from selectedHero

In Angular tutorial lesson 2 on https://embed.plnkr.co/?show=preview I can see in HeroComponent template, [(ngModel)] is 2-way binding the selectedHero.name as the input value changes. How come...

Angular 5 Binding

I am new to angular 5 and I am working on a task to calculate number of cars based on number of bags and passengers as each car have a specific capacity for each of them. So the user enter the...

ion-datetime bind to epoch

I have a model that requires the date/time as milliseconds in Unix Epoch format. I have tried using the Moment interface, Date | numeric as type and I can't seem to get it right. I want the...

Data binding inside ngFor

I am working on a project, where I am getting questions from backend with multiple options. Now in one of question type - Multi choice grid question, we are trying to create view like this for...

Angular 2+ One way data binding from view target to data source

In my angular application, I have a element that allows a user to set a description value. I want that value to be acceccable in the Data Source. I got this to work using 2-way data binding, as...

Inserting HTML (with angular 2 directives) from the server into the DOM

I have ~2,000 lines of HTML code that I can retrieve from my Java server. This HTML code also has angular directives inside of it, such as ngIf* and (click) and [ngClass]. When I try to display...

Angular - Uncaught Error: Cannot assign to a reference or variable

I have an Angular 8 app. app.component.html <div> <label class="form-check-label f-14"> <input type="checkbox" class="form-check-input" name="isAgree" [(ngModel)]="isAgree"...

How do I get a string value from service in an Angular component?

I am trying to get the value of a string variable explanationText from my QuizService to display in my di-quiz component template using data-binding. console.log is showing undefined for...