Question

我在网站上编辑公司时有一个工作提交系统。目前我正在使用{{f.submit}}提交数据，它为我提供了一个处理提交操作的可点击文本，现在我不想要一个文本，我想要对来自Fontawesome的图标进行提交操作。

这是.hbs文件中的代码

{{#with (changeset company validations) as |changeset|}}
  {{#form-for changeset submit=(action 'submit') as |f|}}
  <div class="card-header bg-primary">
    <div class="row">
      <div class="col-sm-6">
        <a class="card-link text-white" data-toggle="collapse" data-parent="#accordion" href="#collapseOne">Übersicht</a>
      </div>
      <div class="col-sm-6 text-right d-block">
        {{! TODO: Submit via action submit doesnt work}}
        <a class="card-link text-white"><i class="fa save"></i></a>
        <a onclick={{companyEditing}} class="card-link text-white"><i class="fa abort"></i></a>
        <a {{action 'deleteCompany' company}} class="card-link text-white"><i class="fa trash"></i></a>
        <a class="card-link text-white" data-toggle="collapse" data-parent="#accordion" href="#collapseOne"><i class="fa angle"></i></a>
      </div>
    </div>
  </div>
  <div id="collapseOne" class="collapse multi-collapse show border border-primary rounded-bottom">
    <div class="card-body">
        <div class="row">
          <div class="col-sm-12">
            {{f.submit "Save"}}
            {{f.reset "Reset"}}
          </div>
        </div>
        <div class="row">
          <div class="col-sm-2">
            <img class="img-fluid" alt="FIRMENLOGO" src="img/puzzle_logo.png">
          </div>
          <div class="col-sm-10 row">
            <div class="col-sm-4">
              <table class="table-uebersicht">
                <tr>
                  <td>{{f.text-field 'name' label="Name"}}</td>
                </tr>

我想把行动放在

{{f.submit "Save"}}

到

 <a class="card-link text-white"><i class="fa save"></i></a>

元素。

这是它背后的.js文件

import { inject as service } from '@ember/service';
import Component from '@ember/component';
import { computed } from '@ember/object';
import CompanyModel from '../models/company';

export default Component.extend({
  store: service(),
  i18n: service(),
  router: service(),

  personPictureUploadPath: computed('company.id', function() {
    return `/company/${this.get('company.id')}/picture`;
  }),

  actions: {
    submit(changeset) {
      return changeset.save()
    .then(() => this.sendAction('submit'))
    .then(() => this.get('notify').success('Firmenübersicht wurde aktualisiert!'))
    .catch(() => {
      let company = this.get('company');
      let errors = person.get('company').slice(); // clone array as rollbackAttributes mutates

      person.rollbackAttributes();
      errors.forEach(({ attribute, message }) => {
        let translated_attribute = this.get('i18n').t(`company.${attribute}`)['string']
        changeset.pushErrors(attribute, message);
      this.get('notify').alert(`${translated_attribute} ${message}`, { closeAfter: 10000 });
    });
    });
    },
    deleteCompany(companyToDelete) {
      companyToDelete.destroyRecord();
      this.get('router').transitionTo('companies');
      window.location.reload(true);
    }
  }

});

感谢您的回答！

编辑：添加到目前为止我尝试过的内容：我已经尝试了onclick = {{f.submit}}，它不接受错误“f.submit不是第10行修饰符的有效名称”。我尝试过类似：{{action'remit'f}}抛出错误：“Changeset.save不是函数”。我尝试了很多其他类似的结果或导致页面破坏。

上次修改：解决方案为{{action' submit'changeset}}

Ember提交图标

0 个答案: