添加角指令來simple_form在軌選擇選項收集輸入休息

Question

不知道是否有解決類似的問題，我做錯了什麼，或者這是簡單的形式或角之間的衝突，而是：

.field 
    = f.input :role, collection: roles.map(&:name), selected: user.role.try(:name), include_blank: 'Select', required: true, input_html: { "ng-model" => "role" } 

渲染（這看起來是正確的）：

<select ng-model="role" class="select required" name="user[role]" id="user_role"> 
     <option value="">Select</option> 
     <option value="system">system</option> 
     <option selected="selected" value="fcm">fcm</option> 
     <option value="regulatory">regulatory</option> 
     <option value="operations">operations</option> 
     <option value="help_desk">help_desk</option> 
    </select> 

但選擇的值是 '選擇' 的include_blank值。是的，role在用戶上設置。

Answer 1

它這樣做的原因是因爲這樣的角度模式工作，它需要一個這樣的認識。本質上，紅寶石生成select也正確選擇選擇框的selected選項。

但是，一旦加載了角度並在此select上看到ng-model，它會將當前選定的選項設置爲模型的值，在您的情況下爲role。

因此，如果您想爲此select有一個角度模型，您需要設置該模型的初始值。

嘗試以下操作：

.field 
= f.input :role, collection: roles.map(&:name), include_blank: 'Select', required: true, input_html: { "ng-model" => "role", "ng-init" => "role = #{user.role.try(:name)}" } 

注意，selected選項已經完全消除，因爲這將被角模型，該模型被初始化爲使用Ruby字符串插值該值來控制。

Answer 2

我想了一下這個特定的例子，我不太確定你期望結果會發生什麼。

雖然我假設你想要選擇屬性selected="selected"作爲默認值，而不是value=""，這只是一個空白字段。如果我的理解正確並且這是重點，那就意味着有幾個領域，這可能是不正確的，我們（社區）不知道你是如何完成它們的，但我認爲我挖掘出了這個問題......;）

Angular指令 - 起初，我不知道在示例中使用了哪個版本的角度（我假設1.X，因爲問題從此時起有6個月）。 AngularJS select指令覆蓋了select元素的默認行爲並對其進行了一些修改。

我爲測試準備了simple example with Angular v1.0.1，它看起來在幾個方面表現正確。如果您使用ng-model="role"並將角色設置爲fcm（字符串），如$scope.role = 'fcm'，則角度有義務設置該值，如果它能找到它。

我還測試（AngularJS 1.0.1版）如果role沒有設置什麼（不確定），則角也點上的空字符串值，像value=""並看不進去屬性selected，而不是將其設置爲默認值。另一方面，最新穩定的AngularJS v1.5.6確實支持selected屬性example with AngularJS v1.5.6，所以它可能是問題的核心。

好，該解決方案很簡單：

• 最新1.X版本升級AngularJS或
• 考慮使用 ngSelected 或ngInit/SO solution代替如果版本AngularJS你使用支持。