单击角度填充子控件-Java 学习之路

我是Angular和反应形式的全新手 .

我有一个UI设计，其中有两个选择列表，想法是单击第一个选择列表将填充第二个选择列表 . 第一个选择列表调用子组件上的方法，该方法向返回JSON数据的Http服务发出请求 . 返回JSON但从不重新填充子组件的选择列表 . 使用Logging，我能够看到正在调用子组件上的方法，JSON正在返回 . 作为测试，我还使用相同的模板代码创建了一个测试组件，组件中唯一的变化是选择列表填充了OnInit，并且它工作得很好 .

模板：出于某种原因，我无法显示我的模板代码，但我正在使用* ngFor =“let board of boardList”value =“{}”> {}来填充选择的选项 .

零件：

export class BoardForMinistryComponent implements OnInit {

    boardList: IBoard[];
    errorMessage: string;
    boardSelect: FormGroup;
    innerURL: string;

    constructor(private bService: BoardsService, private fb: FormBuilder) { }

    ngOnInit() {
        this.boardSelect = this.fb.group({
            boardSelector: ''
        });
    }

    reloadBoardList(theUrl: string): void {
        this.boardSelect = this.fb.group({
            boardSelector: ''
        });

        this.innerURL = theUrl;

        this.bService.getBoardsForMinistry(theUrl)
            .subscribe(b => this.boardList = b,
            error => this.errorMessage = <any>error);
    }
}

1 回答

您必须在创建表单后订阅更改

export class BoardForMinistryComponent implements OnInit {
...
ngOnInit() {
    this.boardSelect = this.fb.group({
        boardSelector: ''
    });
    this.onChanges() //<--call a function
}
//the function onChanges
onChanges()
{
  this.myForm.get('boardSelector').valueChanges.subscribe(val => 
  {
       reloadBoardList(val);  //<--reload the board list
  });
}
reloadBoardList(theUrl: string): void {
    .....
}

回复于 2024-05-06T21:52:01+08:00

单击角度填充子控件

1 回答

相关问题