简介:
我正在为 angularJs 制定打印指令。 一些库(handsontable、custom-scoller 等)让我创建自己的逻辑,而不是使用浏览器的默认打印。
我发现最好的选择是获取页面的outerHtml,然后用jQuery 解析它,并将一些网格转换为表格,将滚动条转换为可扩展的div。但是,除了选择元素之外,一切都运行良好。
对于输入,例如,它非常简单,您只需要求 jQuery 给您值,但对于选择,您不能询问所选选项并获取其内部文本。
问题:
如何从ng-options创建的选择元素中获取并通过outerHtml获取所选选项innerText?
对于输入,非常简单,只需要求$(input).val()
但对于 select 你不能问
对于 $(选择:已选择)
因为它会给你错误的选择选项,这是因为 angularJs 如何处理选择和对象。
额外信息:
如果您查看 angularJs ng-options 生成的 html 代码,它将如下所示:
<select ng-model="type" ng-options="item.value as item.text for item in list" class="form-control ng-valid ng-dirty ng-valid-parse ng-touched">
<option value="number:1" label="Prices" selected="selected">Prices</option>
<option value="number:2" label="Gifts">Gifts</option>
<option value="number:3" label="Total">Total</option>
</select>
正如您所看到的,在屏幕上选择的选项是“礼物”,但在 html 代码中实际上选择的是“价格”。 这就是为什么我无法使用jquery来获取所选选项innerText的原因。 AngularJs 不会更新所选元素的 html dom,导致无法仅通过 html 源获取其值。
我在 jsFiddle 上创建了该情况的演示。
只需使用 selectBox,单击 getOuterHtml
按钮即可看到没有任何变化。
有什么建议吗?
最佳答案
您可以使用该值来选择选项,然后获取其html:http://jsfiddle.net/bb23u1vy/1/
var val = clone.find('select').val();
$scope.html = clone.find('select option[value="' + val + '"]').html();
关于javascript - 如何使用jQuery从 Angular outerHtml获取所选选项的innerText?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36206393/