如何检索json值并以变量angular 4存储

Question

我有这样的JSON，请看下面的

class Posts(DetailView):
    model = Book
    template_name='books/post_create.html'
    slug_field = 'id'

    def get_context_data(self, **kwargs):
        context = super().get_context_data(**kwargs)
        book = self.object
        posts = Post.objects.filter(the_book=book)
        context['posts'] = posts
        return context

使用matselect角度材质在多选下拉列表中显示学期值。如果某人选择了特定的学期，则相应的subjectName应显示在另一个下拉列表中。

我无法做到这一点，请帮助

Answer 1

如果我正确理解您的问题，您将需要使用与您的模板类似的内容：

<mat-form-field>
<mat-select>
  <mat-option *ngFor="let sem of Semester" [value]="sem.queueName" formControlName="firstDropdown">
    {{ sem.queueName }}
  </mat-option>
</mat-select>
<mat-select>
  <mat-option *ngFor="let sub of selectedSemester.subjectDetails">
    {{ sub.subjectName }}
  </mat-option>
</mat-select>
</mat-form-field>

在相应的打字稿文件中，您可以将两者绑定在一起，使selectedSemester初始化为Semester[0]，并在第一个下拉列值更改时更新。就个人而言，我可能会使用基于类的表单，然后订阅更改observable并在数据回调中设置selectedSemester。可能有一个更好的解决方案，我没有测试过，但它可能看起来类似于以下内容：

ngOnInit() {
  this.selectedSemester = this.Semester[0]
  this.myForm.valueChanges.subscribe(
    data => { 
       const temp = this.myForm.get('firstDropdown').value
       this.selectedSemester = this.Semester.find(
         el => el.queueName === temp
       )
     }
  )

希望这会有所帮助，但确切的实施将在很大程度上取决于您应用的其余部分。

祝你好运！

Answer 2

如果我没有错，你的要求是根据第一个下拉菜单下载学期项目的下拉菜单，然后再根据第一个下拉菜单下拉主题。

在* .component.html

中

choosenSub = '';

在* .component.ts

中

<button class='click_button'>Click</button>

stackblitz demo

以下是它的工作原理：

Answer 3

所以，在你的组件中，你可能会有这样的东西。

 public form: FormGroup = new FormGroup({
    semester: new FormControl(''),
 });

这是一个选项，现在您必须获取mat-select值。 semester.subjectDetails是一个数组对象，因此，您只需要填充其他下拉列表。

 <mat-select formControlName="semester" required placeholder="Semester">
            <mat-option *ngFor="let semester of JsonSemester"
                        [value]="semester.subjectDetails">
              {{ semester.queueName}}
            </mat-option>
    </mat-select>