Angular.js: Pengikatan placeholder textarea menyebabkan pengecualian di IE11

Juga terjadi di ie10, mencoba mengakses nodeValue pada TextNode tanpa induk (nodeType=3)

// in function addTextInterpolateDirective()
node[0].nodeValue = value

Mungkin terkait dengan https://github.com/angular/angular.js/issues/2614 ??

Inilah solusi sementara... http://stackoverflow.com/a/20649762/1009125

Saya masih lebih suka mengendus kemampuan daripada mengendus agen pengguna ..... Lihat posting saya di #2614

Kedengarannya bagus, tetapi kemampuan mana yang dapat diuji dalam kasus ini? Yaitu .... ugh

Kemampuan untuk tidak memunculkan acara saat placeholder berubah (seperti
cuplikan yang saya posting di edisi lain (saya pikir itu masih berlaku))
Pada 17 Des 2013 21:24, "Ender2050" [email protected] menulis:

Kedengarannya bagus, tetapi kemampuan mana yang dapat diuji dalam kasus ini? Yaitu .... ugh

—
Balas email ini secara langsung atau lihat di Gi tHubhttps://github.com/angular/angular.js/issues/5025#issuecomment -30818022
.

Seperti yang disarankan oleh dokumen: Cara termudah untuk mengatasi masalah tersebut adalah dengan beralih dari menggunakan placeholder="{{value}}" ke ng-attr-placeholder="{{value}}" .

@seckardt Keren, saya tidak tahu tentang ngAttr . Saya menulis arahan khusus sebagai solusi, tetapi sekarang saya bisa menyingkirkannya.

Saya melihatnya di bawah Panduan / Arahan Pengembang di dokumen, tetapi tidak di referensi API. Bukankah itu ide yang baik untuk memilikinya di sana juga?

Ini bukan hanya placeholder binding yang memunculkan kesalahan ini. Ini gagal dengan perilaku yang sama:

<textarea ng-model="foo">{{ foo }}</textarea>

Interpolasi berlebihan, jadi solusi dalam kasus ini hanya menghapus {{ foo }} , tetapi agak mengganggu karena pesan kesalahan untuk ini sangat tidak berguna. Saya menghabiskan beberapa jam untuk memecahkan masalah ini sebelum menemukan masalahnya.

Kesalahan ini juga terjadi saat mengatur gaya style="padding: 3px; background: {{l.Color}}; opacity: 0.7; border-radius: 5px"

Bagaimana saya bisa mengganti ekspresi ini dengan cara yang berfungsi dengan IE?

Ini adalah masalah yang diketahui dengan IE. Seperti disebutkan di atas, Anda dapat menggunakan ng-attr-style="..." .

Siapa pun yang mendapatkan kesalahan ini, cari saja argumen yang dikirim untuk textarea.

Saya menggunakan sudut 1.2.28 saya memiliki kesalahan yang sama.
<textarea ng-model="data">{{data}}</textarea> bekerja dengan baik di Mozilla. Tapi, IE 11 memberikan kesalahan argumen yang tidak valid. untuk bagian kode ini.
Larutan:
<textarea ng-model="data"></textarea> ATAU <textarea>{{data}}</textarea>
Sepertinya mengikat ng-model dan menempatkan nilai secara langsung menyebabkan kesalahan ini yang juga logis.
Hanya berpikir ini mungkin bisa membantu. Bagaimanapun, posting ini sangat membantu saya.

Kesalahan ini terjadi, karena (untuk alasan apa pun) IE untuk sementara mengubah <textarea placeholder="{{'foo'}}"></textarea> menjadi <textarea placeholder="{{ 'foo' }}">{{ 'foo' }}</textarea> . Ini menambahkan arahan interpolasi teks implisit pada {{ 'foo' }} TEXT_NODE, tetapi pada saat Angular mencoba menyetel nilai TEXT_NODE, nilai itu telah dihapus lagi oleh IE.

Dan mencoba menyetel lemparan TEXT_NODE nodeValue tanpa induk (mis parentlessTextNode.nodeValue = 'foo' ) di IE.

Saya pikir ini bukan masalah terkait Angular dan (dengan mempertimbangkan bahwa ada solusi yang masuk akal - menggunakan ng-attr-placeholder ) kita harus mendokumentasikannya dan melanjutkan.

Laporan bug ini tampaknya relevan. Tampaknya nilai placeholder akan bertahan sebagai konten <textarea> . Mereka telah memperbaikinya (setidaknya di IE11 terbaru), tetapi tidak 100%; yaitu teks placeholder memang muncul sebagai konten, meskipun hanya sementara.

Dalam kasus saya, saya bahkan tidak memiliki placeholder. Saya hanya memiliki sesuatu yang mirip dengan <textarea ng-model='$parent.freetext.text' >{{dataobject.text}}</textarea> ini dan saya masih mendapatkan kesalahan interpolasi. Setiap pemikiran/solusi sangat dihargai. FYI, saya menggunakan versi 1.5 dari angularjs...

@LotusShiv , jangan beri nilai apa pun di area teks Anda. Jika Anda ingin menginisialisasinya, letakkan nilai pada model sebagai gantinya.

Jadi gkalpak - dalam kasus saya, saya perlu mengikat nilai yang ada dari panggilan WebAPI dan juga mengizinkan pengguna untuk mengedit area teks. Karenanya saya memiliki pengaturan nilai ng-model dan textarea. Sekarang cara saya memahami dari respons Anda adalah - saya harus mengatur nilai yang berasal dari panggilan WebAPI ke variabel objek $scope dan menggunakan variabel objek $scope yang sama untuk mengatur konten yang diedit juga. Apakah saya memahami Anda dengan benar? Sekali lagi terima kasih sebelumnya atas saran/solusi apa pun. Kode sampel juga dihargai....

Tambahan untuk komentar saya sebelumnya, saya melakukan persis seperti yang saya jelaskan tentang apa yang saya pahami dari saran gkalpak dan itu berhasil. Terima kasih gkalpak , bekerja dengan baik di IE 11 . Menyelamatkan banyak sakit hati.... :) setelah berhari-hari mencoba begitu banyak tips dan trik lainnya ....

Seperti yang telah disebutkan oleh banyak orang di atas, kesalahan ini sebenarnya adalah kesalahan penggunaan, dalam kasus saya itu bukan di textarea tetapi komentar di atas sangat membantu. Terimakasih semuanya :)
Akan menempatkan masalah khusus saya dan memperbaikinya di bawah ini untuk orang lain yang mungkin berada dalam situasi yang sama.

Tidak bekerja;
<a concat="[result.responsible.Contact.firstName, result.responsible.Contact.lastName]">{{responsibleFullName}}</a>
Bekerja;
<a>{{result.responsible.Contact.firstName}} {{result.responsible.Contact.lastName}}</a>

Juga mengalami masalah ini, bagi saya itu adalah template attr in directive. Ketika Anda hanya menggunakan template: '{{field}}' Anda akan mendapatkan kesalahan ini. Bagi saya, saya mengganti elemen HTML dengan konten yang dikompilasi, jadi solusinya adalah menghapus {{field}} dan membiarkannya hanya dengan template: '' , tetapi ini adalah bug yang aneh dan men-debug-nya di IE menyakitkan :(

Hal yang sama dengan pengikatan rows untuk textarea , dan ya, IE tidak memberi saya petunjuk APAPUN sampai saya harus mengaktifkan mode "break on every exception" dan melangkah melalui satu miliar pengecualian kesempatan pertama. Info debug sudut dalam pengecualian juga hanya mengarahkan saya ke komponen, tetapi tidak ke apa yang salah dengannya. Bagaimanapun, diperbaiki dengan mengubah pengikatan dari [rows]="myRowsField" menjadi [attr.rows]="myRowsField"

@seckardt Anda membuat hari saya menyenangkan. Salah satu proyek saya yang sangat lama masih didasarkan pada Angular1, berjuang untuk menemukan solusi untuk masalah ini. Terima kasih banyak.

Bahkan jika ada "solusi mudah", itu akan jauh lebih mudah, jika pesan kesalahan akan sedikit lebih membantu. Saya punya proyek besar dan _somewhere_ ada interpolasi ganda ini. Bagaimana saya bisa menemukan ini?