Questions tagged [angular]
Questions about Angular (not to be confused with AngularJS), the web framework from Google. Use this tag for Angular questions which are not specific to an individual version. For the older AngularJS (1.x) web framework, use the AngularJS tag.
angular
22,866
questions
136
votes
10
answers
49k
views
How do I return the response from an Observable/http/async call in angular?
I have service which returns an observable which does an http request to my server and gets the data. I want to use this data but I always end up getting undefined. What's the problem?
Service:
@...
- 40.2k
80
votes
1
answer
30k
views
Firebase query if child of child contains a value
The structure of the table is:
chats
--> randomId
-->--> participants
-->-->--> 0: 'name1'
-->-->--> 1: 'name2'
-->--> chatItems
etc
What I am trying to do is query the chats table to find all the ...
- 855
242
votes
3
answers
178k
views
Dynamic tabs with user-click chosen components
I'm trying to setup a tab system that allows for components to register themselves (with a title). The first tab is like an inbox, there's plenty of actions/link items to choose from for the users, ...
- 2,630
1087
votes
25
answers
747k
views
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 ...
- 32.4k
1045
votes
31
answers
415k
views
Angular/RxJS When should I unsubscribe from `Subscription`
When should I store the Subscription instances and invoke unsubscribe() during the ngOnDestroy life cycle and when can I simply ignore them?
Saving all subscriptions introduces a lot of mess into ...
- 12.4k
226
votes
16
answers
193k
views
How can I use/create dynamic template to compile dynamic Component with Angular 2.0?
I want to dynamically create a template. This should be used to build a ComponentType at runtime and place (even replace) it somewhere inside of the hosting Component.
Until RC4 I was using ...
- 123k
354
votes
22
answers
117k
views
What is the correct way to share the result of an Angular Http network call in RxJs 5?
By using Http, we call a method that does a network call and returns an http observable:
getCustomer() {
return this.http.get('/someUrl').map(res => res.json());
}
If we take this observable ...
- 42.8k
1489
votes
27
answers
836k
views
Difference between Constructor and ngOnInit
Angular provides life cycle hook ngOnInit by default.
Why should ngOnInit be used, if we already have a constructor?
- 17.1k
741
votes
15
answers
974k
views
How can I select an element in a component template?
Does anybody know how to get hold of an element defined in a component template? Polymer makes it really easy with the $ and $$.
I was just wondering how to go about it in Angular.
Take the example ...
- 8,033
147
votes
9
answers
77k
views
Equivalent of $compile in Angular 2
I want to manually compile some HTML containing directives. What is the equivalent of $compile in Angular 2?
For example, in Angular 1, I could dynamically compile a fragment of HTML and append it ...
- 52.4k
204
votes
34
answers
122k
views
Angular 2.0 router not working on reloading the browser
I am using Angular 2.0.0-alpha.30 version. When redirect to a different route, then refresh the browser , its showing Cannot GET /route.
Can you help me with figuring why this error happened.
- 3,537
495
votes
4
answers
405k
views
Triggering change detection manually in Angular
I'm writing an Angular component that has a property Mode(): string.
I would like to be able to set this property programmatically not in response to any event.
The problem is that in the absence of ...
- 9,389
686
votes
21
answers
754k
views
access key and value of object using *ngFor
I am a bit confused about how to get the key and value of an object in angular2 while using *ngFor for iterating over the object. I know in angular 1.x there is a syntax like
ng-repeat="(key, value) ...
- 85.5k
282
votes
7
answers
192k
views
Delegation: EventEmitter or Observable in Angular
I am trying to implement something like a delegation pattern in Angular.
When the user clicks on a nav-item, I would like to call a function which then emits an event which should in turn be handled ...
- 12.8k
81
votes
2
answers
68k
views
In RC.1 some styles can't be added using binding syntax
Styles like
<div [style.background-image]="\'url(\' + image + \')\'">Background</div>
<div [style.transform]="rotate(7deg)"
are not added anymore
- 641k
412
votes
26
answers
635k
views
How to use jQuery with Angular?
Can anyone tell me, how to use jQuery with Angular?
class MyComponent {
constructor() {
// how to query the DOM element from here?
}
}
I'm aware there are workarounds like ...
- 7,187
1875
votes
35
answers
829k
views
What is the difference between Promises and Observables?
What is the difference between Promise and Observable in Angular?
An example on each would be helpful in understanding both the cases. In what scenario can we use each case?
- 18.8k
77
votes
4
answers
63k
views
How to pass parameters rendered from backend to angular2 bootstrap method
Is there a way to pass arguments rendered on the backend to angular2 bootstrap method? I want to set http header for all requests using BaseRequestOptions with value provided from the backend. My main....
- 2,500
1196
votes
24
answers
2.1m
views
Angular: conditional class with *ngClass
What is wrong with my Angular code? I am getting the following error:
Cannot read property 'remove' of undefined at BrowserDomAdapter.removeClass
<ol>
<li *ngClass="{active: step==='...
- 35k
364
votes
11
answers
144k
views
Is it necessary to unsubscribe from observables created by Http methods to avoid memory leaks?
Do you need to unsubscribe from Angular 2 http calls to prevent memory leak?
fetchFilm(index) {
var sub = this._http.get(`http://example.com`)
.map(result => result.json())
...
- 24.6k
313
votes
5
answers
427k
views
What is the proper use of an EventEmitter?
I've read questions like Access EventEmitter Service inside of CustomHttp
where the user uses EventEmitter in his service, but he was suggested in this comment
not to use it and to use instead ...
- 31.5k
1028
votes
14
answers
669k
views
What is the difference between BehaviorSubject and Observable?
I'm looking into the design patterns of RxJS, and I do not understand the difference between BehaviorSubject and Observable.
From my understanding, BehaviorSubject can contain a value that may change. ...
- 10.4k
373
votes
25
answers
576k
views
How to apply filters to *ngFor?
Apparently, Angular 2 will use pipes instead of filters as in Angular1 in conjunction with ng-for to filter results, although the implementation still seems to be vague, with no clear documentation.
...
- 8,345
456
votes
10
answers
317k
views
What is the difference between Subject and BehaviorSubject?
I'm not clear on the difference between a Subject and a BehaviorSubject. Is it just that a BehaviorSubject has the getValue() function?
- 10.1k
647
votes
19
answers
485k
views
*ngIf and *ngFor on same element causing error
I'm having a problem with trying to use Angular's *ngFor and *ngIf on the same element.
When trying to loop through the collection in the *ngFor, the collection is seen as null and consequently ...
- 12.2k
57
votes
2
answers
122k
views
CORS Error: “requests are only supported for protocol schemes: http…” etc
I am trying to run a simple application. I have an Express backend which returns a JSON string when visited at localhost:4201/ticker. When I run the server and make a request to this link from my ...
- 2,654
545
votes
16
answers
709k
views
Binding select element to object in Angular
I'd like to bind a select element to a list of objects -- which is easy enough:
@Component({
selector: 'myApp',
template:
`<h1>My Application</h1>
<select [(ngModel)]...
- 10.8k
677
votes
31
answers
739k
views
How to detect a route change in Angular?
I am looking to detect a route change in my AppComponent.
Thereafter I will check the global user token to see if the user is logged in so that I can redirect the user if the user is not logged in.
- 16.4k
446
votes
23
answers
498k
views
Expression ___ has changed after it was checked
Why is the component in this simple plunk
@Component({
selector: 'my-app',
template: `<div>I'm {{message}} </div>`,
})
export class App {
message:string = 'loading :(';
...
- 32k
348
votes
19
answers
266k
views
Angular HTTP GET with TypeScript error http.get(...).map is not a function in [null]
I have a problem with HTTP in Angular.
I just want to GET a JSON list and show it in the view.
Service class
import {Injectable} from "angular2/core";
import {Hall} from "./hall";
import {Http} ...
- 4,101
248
votes
10
answers
438k
views
Adding a HTTP header to the Angular HttpClient doesn't send the header, why?
Here is my code:
import { HttpClient, HttpErrorResponse, HttpHeaders } from '@angular/common/http';
logIn(username: string, password: string) {
const url = 'http://server.com/index.php';
...
- 3,299
1336
votes
52
answers
1.4m
views
Can't bind to 'formGroup' since it isn't a known property of 'form'
The situation
I am trying to make what should be a very simple form in my Angular application, but no matter what, it never works.
The Angular version
Angular 2.0.0 RC5
The error
Can't bind to '...
- 21.2k
420
votes
21
answers
877k
views
How do I pass data to Angular routed components?
In one of my Angular 2 routes's templates (FirstComponent) I have a button
first.component.html
<div class="button" click="routeWithData()">Pass data and route</div>
My goal is to ...
- 15k
212
votes
9
answers
182k
views
What to use in place of ::ng-deep
I'm trying to style an element placed by the router outlet in angular and want to make sure that the element generated gets a width of 100%
From most of the replies, I'm seeing that I should use the :...
- 2,295
228
votes
23
answers
353k
views
How to load external scripts dynamically in Angular?
I have this module which componentize the external library together with additional logic without adding the <script> tag directly into the index.html:
import 'http://external.com/path/file.js'
...
- 8,428
220
votes
11
answers
313k
views
How to set <iframe src="..."> without causing `unsafe value` exception?
I am working on a tutorial involving the setting of an iframe src attribute:
<iframe width="100%" height="300" src="{{video.url}}"></iframe>
This throws an exception:
Error: unsafe ...
- 11.5k
935
votes
37
answers
1.3m
views
Property '...' has no initializer and is not definitely assigned in the constructor
in my Angular app i have a component:
import { MakeService } from './../../services/make.service';
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-vehicle-form',
...
- 9,821
382
votes
10
answers
583k
views
Send data through routing paths in Angular
Is there anyway to send data as parameter with router.navigate?
I mean, something like this example, as you can see the route has a data parameter, but doing this it's not working:
this.router....
- 4,364
47
votes
7
answers
57k
views
What's the best way to inject one service into another in angular 2 (Beta)?
I know how to inject a service into a component (via @Component), but how can I use DI to pass around services outside of components?
In other words, I don't want to do this:
export class MyFirstSvc ...
- 6,749
746
votes
36
answers
1.5m
views
Unable to resolve dependency tree error when installing npm packages
When trying to install the npm packages using npm i command, I am getting the following exception:
I have tried reinstalling the Node.js package and setting the proxy to off using:
set HTTP_PROXY=
...
- 8,859
647
votes
4
answers
113k
views
What is the meaning of the "at" (@) prefix on npm packages?
In the Angular Component Router documentation I just stumbled over a npm command I have never seen before and I don't understand what is going on:
npm install @angular/router --save
What is the ...
- 17.8k
91
votes
6
answers
83k
views
How do I share data between components in Angular 2?
In Angular 1.x.x you simply ask for the same service and you end up with the same instance, making it possible to share the data in the service.
Now in Angular 2 I have a component that has a ...
- 15.2k
459
votes
9
answers
377k
views
Angular - Use pipes in services and components
In AngularJS, I am able to use filters (pipes) inside of services and controllers using syntax similar to this:
$filter('date')(myDate, 'yyyy-MM-dd');
Is it possible to use pipes in services/...
- 4,713
207
votes
14
answers
387k
views
File Upload In Angular?
I know this is very a general question but I am failing to upload a file in Angular 2.
I have tried
1) http://valor-software.com/ng2-file-upload/ and
2) http://ng2-uploader.com/home
...but ...
- 3,001
134
votes
13
answers
133k
views
Angular 2 Sibling Component Communication
I have a ListComponent. When an item is clicked in ListComponent, the details of that item should be shown in DetailComponent. Both are on the screen at the same time, so there's no routing involved....
- 2,585
2122
votes
51
answers
1.7m
views
Can't bind to 'ngModel' since it isn't a known property of 'input'
I have this simple input in my component which uses [(ngModel)] :
<input type="text" [(ngModel)]="test" placeholder="foo" />
And I get the following error when I ...
338
votes
15
answers
813k
views
Angular File Upload
I'm a beginner with Angular, I want to know how to create Angular 5 File upload part, I'm trying to find any tutorial or doc, but I don't see anything anywhere. Any idea for this? And I tried ng4-...
- 5,295
240
votes
7
answers
339k
views
Angular 2: 404 error occur when I refresh through the browser [duplicate]
I have stored my single-page application in my server within a folder named as "myapp". I have changed the URL in the base to http://example.com/myapp/`.
My project has two pages. So I ...
- 3,190
171
votes
18
answers
305k
views
Iterate over object in Angular [duplicate]
I am trying to do some things in Angular 2 Alpha 28, and am having an issue with dictionaries and ngFor.
I have an interface in TypeScript looking like this:
interface Dictionary {
[index: string]:...
- 2,680
60
votes
4
answers
59k
views
Angular 2 http get not getting
I new to Angular 2 still learning I am trying to hit a URL with a get call but the get doesn't seem to go through even in browser's network I cannot find that get URL being called.
The program is ...
user7161814