Angular2のngfor内に属性を設定します

Question

ngForの中で選択した属性を設定しようとしています。ブラウザがダムであり、checked=falseはまだチェックされているため、以下のコードは機能しません。

したがって、返されるものはすべてtrueまたはnullにする必要があります。 私はこの人の投稿*ngIf for html attribute in Angular2を見ましたが、forループからその関数に値を渡す必要があるため、私はそれを扱うことができません。

また、[attr.checked]をclickイベントのような機能に設定しようとしましたが、それでも機能しませんでした。

テンプレート：

<div class="tools"> 
    <div class="radio-group group-{{section.name}}"> 
    <label *ngFor="let content of section.content" class="{{content.name}}"> 
     <input 
     type="radio" 
     name="{{section.three}}-{{section.name}}" 
     value="{{content.id}}" 

<!-- This is my problem --> 
     [attr.checked]="content.id === section.default" 
<!-- You've just pass the problem --> 

     (click)="updateModel(section, content)" /> 
     <div class="radio"> 
     <span *ngIf="content.thumbnail.charAt(0) == '#'" 
      class="image" [style.background-color]="content.thumbnail"> 
     </span> 
     <span *ngIf="content.thumbnail.length > 0 && 
        content.thumbnail.charAt(0) != '#'" class="image"> 
      <img src="/thumbnails/{{section.three}}/{{content.thumbnail}}.jpg" alt="" /> 
     </span> 
     <span *ngIf="content.thumbnail == ''" class="image"></span> 
     <span class="label">{{content.displayName}}</span> 
     </div> 
    </label> 
    </div> 
</div> 

コンポーネント：

import { Component, Input } from '@angular/core'; 
import { AService } from './a.service'; 

@Component({ 
    selector: '[radio]', 
    templateUrl: 'app/newtabs/ui.radio.component.html' 
}) 
export class UiRadioComponent { 
    constructor(private aService: AService) {} 

    @Input() section:any; 

    updateModel(info: any, content: any) { 
      //does things but not important 
     } 
    } 
} 

Answer 1

あなたは単にインラインで値を比較することによって、属性を設定することができるはずです。試してください：

[attr.checked]="section.default == content.id ? 'checked' : null"