Question

我很贪图，所以请你好一点：）

我有一个Ember应用程序，我想重定向到从文本字段输入中获取的特定slug。在我的.hbs中，我有以下代码：

<div class="liquid-container">
  <div class="liquid-child">
    <div class="desktop-layout-scroll-container">
      <div class="overlay-info-layout">
        <div class="overlay-info-layout-content">
          <h1 class="expired-overlay-status">{{t 'code.title'}}</h1>
          <h2 class="expired-overlay-explanation">
            {{t 'code.description'}}<br>
          </h2>

          <div class="row">
            <div class="col-xs-offset-3 col-xs-6">
              <input name="txtSlug" type="text" id="txtSlug" class="field" />            
              <input type="submit" name="btnGo" value="" id="btnGo" class="btn" onclick="javascript:SubmitForm()" />
            </div>
          </div>

        </div>
      </div>
    </div>
  </div>
</div>

<script type="text/javascript">
    function SubmitForm(){
        var Slugtxt = document.getElementById("txtSlug").value;
        window.location = "http://www.google.com/" + Slugtxt;
    }
</script>

Answer 1

你永远不应该在Ember .hbs文件中嵌入JavaScript。这段代码真的应该放在你的控制器中。首先，生成您的控制器：

ember g controller <name_of_route>

然后在你的控制器里面，你要定义两件事。 slugtxt变量，并重定向为动作。这看起来像这样：

import Ember from 'ember';

export default Ember.Controller.extend({

  slugtxt: '',

  actions: {
    redirect() {
      window.location = "http://www.google.com/" + this.get('slugtxt');
    }
  }
}

然后，回到模板中，您需要将输入更改为从控制器映射到slugtxt变量，并将按钮的操作设置为您定义的redirect操作在你的控制器中。这看起来像这样：

{{input value=slugtxt}}
<button {{action "redirect"}}>Submit</button>

无需担心使用<input>标记，您通常不会使用带有ember的表单数据。

从ember中的textfield重定向到特定的slug

1 个答案: