Вопросы по тегу: components

(5)

How to manage Angular2 "expression has changed after it was checked" exception when a component property depends on current datetime

My component has styles that depend on current datetime. In my component I've got the following function. private fontColor( dto : Dto ) : string { // date d'exécution du dto let dtoDate : Date = new Date( dto.LastExecution ); (...) let color = "hsl( " + hue + ", 80%, " + (maxLigness - lightnessAmp) + "%)"; return color; } lightnessAmp is calculated from the current datetime. The color changes if dtoDate is in the last 24 hours.The exact error is the following: Expression has changed after it was checked. Previous value: 'hsl( 123, 80%, 49%)'. Current value: 'hsl( 123, 80%, 48%)' I know the exception appear in development mode only at the moment the value is checked. If the checked value is different of the updated value, the exception is thrown.So I tried to update the current datetime at each lifecycle in the following hook method to prevent the exception: ngAfterViewChecked() { console.log( "! changement de la date du composant !" ); this.dateNow = new Date(); } ...but without success.
A

Anthony Brenelière

5 лет назад

Ответов: 11

Как обновить компонент в Angular

Я работаю над проектом Angular. У меня проблемы с обновлением компонента. Я хочу обновить компоненты роутера нажатием кнопки. У меня появляется кнопка обновления, когда я нажимаю на нее, компонент / маршрутизатор необходимо обновить. Я пробовал window.location.reload () и location.reload (), эти два не подходят для моих нужд. Пожалуйста, помогите, если кто об этом знает.
S

Sreehari Ballampalli

4 года назад

Ответов: 20

Manually Set Value for FormBuilder Control

This is driving me nuts, I'm under the gun and can't afford to spend another whole day on this.I am trying to manually set a control value ('dept') within the component, and it's just not working - even the new value logs to console properly.Here is the FormBuilder Instance:initForm() { this.form = this.fb.group({ 'name': ['', Validators.required], 'dept': ['', Validators.required], 'description': ['', Validators.required], }); } This is the event handler that receives the selected dept:deptSelected(selected: { id: string; text: string }) { console.log(selected) // Shows proper selection! // This is how I am trying to set the value this.form.controls['dept'].value = selected.id; } Теперь, когда форма отправлена ​​и я выхожу из this.formсистемы, поле все еще остается пустым! Я видел другое использование ppl, updateValue()но это beta.1, и я не считаю это подходящим методом для вызова элемента управления.I have also tried to call updateValueAndValidity() with no success :(.I would just use ngControl="dept" on the form element, like I'm doing with the rest of the form but its a custom directive/component. [placeholder]="'No Dept Selected'">
M

Matthew Brown

6 лет назад

Ответов: 11

What's the difference between an Angular component and module

I've been watching videos and reading articles but this specific article make me so confused, at the start of the article it says The applications in Angular follow modular structure. The Angular apps will contain many modules, each dedicated to the single purpose. Typically module is a cohesive group of code which is integrated with the other modules to run your Angular apps. A module exports some classes, function and values from its code. The Component is a fundamental block of Angular and multiple components will make up your application. A module can be a library for another module. For instance, the angular2/core library which is a primary Angular library module will be imported by another component. Are they exchangeable terms? Is a component a module? But not viceversa?
L

Luis Pena

5 лет назад

Ответов: 7

Компонент React инициализирует состояние из реквизитов

В React есть ли реальные различия между этими двумя реализациями? Некоторые друзья говорят мне, что FirstComponent - это шаблон, но я не понимаю, почему. SecondComponent кажется более простым, потому что рендер вызывается только один раз.Первый:import React, { PropTypes } from 'react' class FirstComponent extends React.Component { state = { description: '' } componentDidMount() { const { description} = this.props; this.setState({ description }); } render () { const {state: { description }} = this; return ( ); } } export default FirstComponent; Второе:import React, { PropTypes } from 'react' class SecondComponent extends React.Component { state = { description: '' } constructor (props) => { const { description } = props; this.state = {description}; } render () { const {state: { description }} = this; return ( ); } } export default SecondComponent; Обновление: Я изменил setState() на this.state = {} (спасибо joews), Однако я все еще не вижу разницы. Может, один вариант лучше другого?
L

Levy Moreira

5 лет назад

Ответов: 9

2022 WebDevInsider