相关疑难解决方法(0)

我正在使用占位符进行文本输入,这很好.但我也想为我的选择框使用占位符.当然我可以使用这段代码:

<select>
    <option value="">Select your option</option>
    <option value="hurr">Durr</option>
</select>

但是"选择你的选项"是黑色而不是光线.所以我的解决方案可能是基于CSS的.jQuery也很好.

这只会使下拉列表中的选项变为灰色(因此点击箭头后):

option:first {
    color: #999;
}

编辑:问题是:人们如何在选择框中创建占位符？但它已经得到了回答,欢呼.

使用此选项会导致所选值始终为灰色(即使选择了实际选项后):

select {
    color: #999;
}

我是Angular的新手,并试图通过新的做事方式加快速度.

我想将一个select元素绑定到一个对象列表 - 这很容易:

@Component({
   selector: 'myApp',
   template: `<h1>My Application</h1>
              <select [(ngModel)]="selectedValue">
                 <option *ngFor="#c of countries" value="c.id">{{c.name}}</option>
              </select>`
})
export class AppComponent{
    countries = [
       {id: 1, name: "United States"},
       {id: 2, name: "Australia"}
       {id: 3, name: "Canada"},
       {id: 4, name: "Brazil"},
       {id: 5, name: "England"}
     ];
    selectedValue = null;
}

在这种情况下,看起来selectedValue将是一个数字 - 所选项目的ID.

但是,我实际上想要绑定到country对象本身,以便selectedValue是对象而不仅仅是id.我尝试改变选项的值,如下所示:

<option *ngFor="#c of countries" value="c">{{c.name}}</option>

但这似乎不起作用.它似乎将一个对象放在我的selectedValue中 - 但不是我期待的对象.您可以在我的Plunker示例中看到这一点.

我也尝试绑定到change事件,以便我可以根据所选的id自己设置对象; 但是,看起来更改事件在更新绑定的ngModel之前触发 - 这意味着我无法访问此时新选择的值.

是否有一种干净的方法将选择元素绑定到具有Angular 2的对象？

在Angular 1中,我可以使用以下选项为下拉框选择默认选项:

<select 
    data-ng-model="carSelection"
    data-ng-options = "x.make for x in cars" data-ng-selected="$first">
</select>

在Angular 2中我有:

<select class="form-control" [(ngModel)]="selectedWorkout" (ngModelChange)="updateWorkout($event)">
    <option *ngFor="#workout of workouts">{{workout.name}}</option>
</select>

如果我的选项数据是:我如何选择默认选项:

[{name: 'arm'}, {name: 'back'}, {name:'leg'}]而我默认的价值是back？