randomString未在HTMLInputElement.onclick Typescript中定义

时间:2018-03-13 09:14:13

标签: javascript angular typescript

我想创建一个生成随机字符串或数字的函数。

我的功能如下:

  randomString() {
    let chars = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXTZabcdefghiklmnopqrstuvwxyz";
    let string_length = 8;
    let randomstring = '';
    for (let i = 0; i < string_length; i++) {
      let rnum = Math.floor(Math.random() * chars.length);
      randomstring += chars.substring(rnum, rnum + 1);
    }
  }

Html代码

    <form [formGroup]="addProductForm">
          <div class="input-field col s12">
                <input formControlName="Line_num" type="button" value="Create Random String" onClick="randomString();">  
  <input type="text" name="Line_num" value="">    
            </div>
    <form>

单击按钮时,显示以下错误: 未捕获的ReferenceError:在TMLInputElement.onclick

中未定义randomString

现在, 我改变了这个,

this.addProductForm = this.fb.group({
    'Line_num': new FormControl(this.randomString(), Validators.required),
    });

在功能中

   randomString() { 
  return Math
    .random() // Create a random number
    .toString(36) // Convert it to string (26 letters + 10 numbers)
    .split('') // Creates an array of those letters
    .slice(-8) // Take the last height ones
    .join(''); // Join them back to create a string
}

Html代码

 <form [formGroup]="addProductForm">
    <div class="input-field col s12">
        <input type="text" formControlName="Line_num" name="Line_num">
</div>
</form>

问题已解决

2 个答案:

答案 0 :(得分:2)

创建随机字符串的简单方法怎么样?

randomString() { 
  return Math
    .random() // Create a random number
    .toString(36) // Convert it to string (26 letters + 10 numbers)
    .split('') // Creates an array of those letters
    .slice(-8) // Take the last height ones
    .join(''); // Join them back to create a string
}

这更容易阅读,并会纠正您的问题。

为了您的编辑:

this.addProductForm = this.fb.group({
  'Line_num': new FormControl(this.randomString(), Validators.required)
});

在您的HTML中

<form [formGroup]="addProductForm">
  <input type="text" formControlName="Line_num" name="Line_num">
</form>

答案 1 :(得分:0)

中显示您的值

<input type="text" name="Line_num" value="">

在Javascript中,您可以执行类似的操作,例如为此字段添加唯一ID

<input id="myUniqueField" type="text" name="Line_num" value="">

然后在randomString函数结束时才做

document.getElementById("myUniqueField").value = randomstring;