Question

我从 ngForm 中得到了一个像 {general: "this is the value content"} 这样的字典对。

<div class="col-10">
    <div>
        <h1>Terms of Use</h1>
    </div>
    <form #termForm="ngForm" (ngSubmit)="saveTerm(termForm)">
        <div class="col-12">
            <div class="d-flex justify-content-between mb-1">  
                <label for="general" id='general'>General</label>
                <button>Save General</button>
            </div>
            <ckeditor        
                [(ngModel)]="generalContent"
                #general="ngModel"
                name="general"
                [config]="config"
                [readonly]="false">
            </ckeditor>
        </div>
    </form>
</div>

如何将配对数据保存为单独的变量 a 和 b？ a = "一般" b = "这是值内容"

Answer 1

如果您已经将对象存储在变量中，并且您计划仅将单个键值对映射到“a”和“b”，您可以使用：

const obj = { general: "this is the value content" };
const result = Object.entries(obj).map(([k,v]) => ({ a: k, b: v }))[0];
// { a: "general", b: "this is the value content" }

Answer 2

如果您有多个键值对，您可以将对象转换为数组：

const terms = {term1: "term1 content", term2: "term2 content"}
const array = Object.entries(terms)
  .map(([key, val]) => [key, val])
  .reduce((a, b) => a.concat(b));
// ["term1", "term1 content", "term2", "term2 content"]

如果你只想在 HTML 中分隔键值，您可以使用 keyvalue 管道：

<div class="col-10">
  <div>
      <h1>Terms of Use</h1>
  </div>
  <form #termForm="ngForm" (ngSubmit)="saveTerm(termForm)">
      <div class="col-12" *ngFor="let term of terms | keyvalue">
          <div class="d-flex justify-content-between mb-1">  
              <label [for]="term.key" [id]="term.key">{{term.key}}</label>
              <button>Save {{term.key}}</button>
          </div>
          <ckeditor        
              [(ngModel)]="term.value"
              #termElem="ngModel"
              [name]="term.key"
              [config]="config"
              [readonly]="false">
          </ckeditor>
      </div>
  </form>
</div>

如何从打字稿中的对象获取键和值

2 个答案: