小编a_z*_*ula的帖子

将值传递给子组件Angular 7

我通过了this,并了解到在声明了数据绑定的输入属性之后,Angular应该自动更新输入值。在我创建的组件中,似乎并非如此。

当我单击父级网格上的项目时,它会正确显示详细信息。之后,当我单击另一个项目时,它不会更新子组件。我放置了console.log来监视所选记录。它会根据用户选择不断变化。

您能否看一下,并帮助我了解问题所在?

listing.component.html [父母]

<div class="container-fluid">
  <div class="row mt-2 mb-2">
    <div class="col-8">
      <app-list-item-add *ngIf="showAddnewScreen" (notifyParentOnUpdate)='onAddItem($event)'></app-list-item-add>
      <app-list-item-view *ngIf="showViewScreen" [studentObject]="selectedstudent" (notifyParentOnUpdate)='onViewItem($event)'></app-list-item-view>
    </div>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

list.component.ts [父母]

import { Component, OnInit, ViewChild } from '@angular/core';
import { studentsService, student } from '../services/students.service';
import { Router, ActivatedRoute } from '@angular/router';
import { GridComponent, ToolbarItems, SortEventArgs, RowSelectEventArgs, SelectionSettingsModel } from '@syncfusion/ej2-ng-grids';
import { ClickEventArgs } from '@syncfusion/ej2-ng-navigations';
import * as moment from 'moment';
import { Internationalization } from '@syncfusion/ej2-base';

@Component({
  selector: 'app-lists', …
Run Code Online (Sandbox Code Playgroud)

data-binding parent-child typescript angular two-way-binding

4
推荐指数
1
解决办法
7540
查看次数

如果 RxJS 中的条件为真,我可以跳过所有后续的运算符链吗

在 RxJS 5.5 中是否可以使用某些运算符来实现条件以跳过所有后续运算符并发出一些值 ( false)?例如,在这个 ng 服务方法中,如果出现以下情况,我将绕过这条.map链的一堆并false立即提供价值response.length === 0

getProjectDrivers(projectId): Observable<any> {
  return this.http.get('someUrl').pipe(
    // if (response.length === 0) { return false; and skip whole operator chain bellow}
    map((response: ProjectDriver[]) => response.filter((projectDriver: ProjectDriver) => projectDriver.streamName !== "AllRevenueStreamTotals")),
    map((response: ProjectDriver[]) => command => ({})
  )
)
.catch(this.handleError);
Run Code Online (Sandbox Code Playgroud)

}

rxjs typescript angular

4
推荐指数
1
解决办法
528
查看次数

基于类的组件中的 dispatch() 方法

我是 React/Redux 绑定的新手,我将实现 Redux 组件,该组件具有刷新笑话的形式,并可能改变获取的笑话数量(默认为 1 个笑话):

      import fetchJokes from '../actions/jokes';
      import { connect } from 'react-redux';

      class FormToRefresh extends React.Component {
        constructor(props) {
          super(props);
          this.state = {value: 1};
          this.handleInput = this.handleInput.bind(this);
          this.handleSubmit = this.handleSubmit.bind(this);
        }

        handleInput(e) {
          let input = e.target.value;
          if(isNaN(input)||input > 10||input< 1) {
            alert("Wrong input");
            this.setState({value: 1}); 
          } else {
            this.setState({value: input})     
          }

          handleSubmit(e) {
            // this should trigger dispatching fetchJokes action
            // but how to integrate dispatch() function here...                

            dispatch(fetchJokes(this.state.value));

          }

          render() {
            return ( …
Run Code Online (Sandbox Code Playgroud)

reactjs redux react-redux

0
推荐指数
1
解决办法
8397
查看次数