typescript 如何在Angular [已关闭]中将批量点击传递数据事件从一个组件发送到另一个组件

4zcjmb1e  于 2022-12-30  发布在  TypeScript
关注(0)|答案(1)|浏览(101)

已关闭。此问题需要超过focused。当前不接受答案。
**想要改进此问题吗?**更新此问题,使其仅关注editing this post的一个问题。

昨天关门了。
Improve this question
这里我有2个组件,第一个有一个不同名称的文件列表,在第二个组件中有一个输入框,我可以给予值,它会索引第一个组件中的文件增量。
例如,如果文件名为:M-1、M-2、M-3、N-4、N-5,因此如果我在第2个组件中给予101,则它应索引第1个组件中的文件,并在不同的第一个字母表文件处停止

101.M-1
102.M-2
103.M-3
    N-4
    N-5

同样,如果我给予201作为第二分量中的值,它应该不是从第一个开始索引,而是从第二个不同的字母表开始值开始索引,因此它应该是

101.M-1
102.M-2
103.M-3
201.N-4
202.N-5

继续,如果有一个不同的文件名与不同的字母表,首先我们应该实现这一点
我试过这样做,但我只能使它像索引,直到字母表改变,其他为空,如果我在第二个组成部分再次输入值,它再次从第一个元素开始,而不是从不同的元素名称

5gfr0r5j

5gfr0r5j1#

首先创建一个包含字母的数组作为JS对象,这样你就可以很容易的索引字母了。

alphabet = {
    A: 1,
    B: 2,
    C: 3,
    D: 4,
    E: 5,
    F: 6,
    // and so on....
  };

我已经创建了示例数据-未排序:

anyData = [
    'B-1',
    'A-1',
    'A-2',
    'D-6',
    'B-2',
    'C-1',
    'C-3',
    'C-2',
    'D-1',
    'F-1',
    'D-2',
    'D-3',
    'A-3',
    'D-4',
    'B-3',
    'D-5',
  ];

这里是所有的魔术。我们拆分字符串,按字母升序排序,并检查数字的顺序。之后,我们Map所有和设置索引(**101。**你想要的)的数据。完成...

// Sort function:
compareFn(a, b) {
    let aLetter = a.split('-')[0];
    let aNumber = +a.split('-')[1];
    let bLetter = b.split('-')[0];
    let bNumber = +b.split('-')[1];

    if (this.alphabet[aLetter] < this.alphabet[bLetter]) return -1;
    if (this.alphabet[aLetter] > this.alphabet[bLetter]) return 1;

    if (this.alphabet[aLetter] === this.alphabet[bLetter]) {
      if (aNumber < bNumber) return -1;
      else return 1;
    }

    // a must be equal to b
    return 0;
  }

// Index function
sortAndIndex() {
    const sortedArray = this.anyData.sort(this.compareFn.bind(this));
    let lastAlphabet = 1,
      index = 0;

    const result = sortedArray.map((data) => {
      index++;
      if (lastAlphabet !== this.alphabet[data.split('-')[0]]) {
        lastAlphabet = this.alphabet[data.split('-')[0]];
        index = 1;
      }
      return (
        this.alphabet[data.split('-')[0]].toString() +
        index.toString().padStart(2, '0') +
        '.' +
        data
      );
    });

    console.log(result);
  }

Here都在Stackblitz上

相关问题