使用Dart获取表单输入值

Question

我试图获取输入元素的值，例如这是一个简单的形式：

<form id="loginForm">
        <label for="username">Username</label>
        <input required type="text" class="form-control" id="username">
        <label for="password">Passowrd</label>
        <input required type="password"id="password">
    </div>
    <button type="submit">Submit</button>
</form>

用jQuery我会写：

let value = $("#password").val();

或者我甚至可以序列化整个表格，

但在Dart中，这似乎不起作用：

querySelector('#username').getAttribute('value');

，它返回null

我没有使用任何框架，

有什么建议？

Answer 1

querySelector只会返回HtmlElement。既然你知道结果是一个InputElement（在那个TextInputElement）你需要投射它以获得对value属性的访问。

(querySelector('#usernames') as InputElement).value

Answer 2

从Dart版本2.2.0（2019）开始，上述答案似乎不再起作用。 Casting现在返回此错误：

Uncaught CastError: Instance of 'HtmlElement': type 'HtmlElement' is not a subtype of type 'InputElement'

这是一种在不进行强制转换的情况下访问输入字段值的方法：

String value = document.getElementById('username').text;