Mungkin pertanyaan konyol, tapi saya punya formulir html dengan input dan tombol sederhana:
<input type="text" ng-model="searchText" />
<button ng-click="check()">Check!</button>
{{ searchText }}
Kemudian di controller (template dan controller dipanggil dari routeProvider):
$scope.check = function () {
console.log($scope.searchText);
}
Mengapa saya melihat tampilan diperbarui dengan benar tetapi tidak terdefinisi di konsol saat mengklik tombol?
Terima kasih!
Pembaruan: Sepertinya saya telah benar-benar menyelesaikan masalah itu (sebelum harus menemukan beberapa solusi) dengan: Hanya perlu mengubah nama properti saya dari searchText
menjadi search.text
, kemudian menetapkan $scope.search = {};
objek kosong di controller dan voila ... Tidak tahu mengapa ini bekerja meskipun;]
searchText
menjadisearch.text
, tahu mengapa?voila
, tidakvuala
,wolla
dllJawaban:
Kontroler sebagai versi (disarankan)
Di sini templatnya
JS
Sebuah contoh: http://codepen.io/Damax/pen/rjawoO
Yang terbaik adalah menggunakan komponen dengan Angular 2.x atau Angular 1.5 atau lebih tinggi
#########Cara lama (TIDAK disarankan)
Ini TIDAK direkomendasikan karena string adalah primitif, sangat disarankan untuk menggunakan objek
Coba ini di markup Anda
dan ini di controller Anda
sumber
searchText
?"Jika kamu menggunakan ng-model, kamu harus memiliki titik di sana."
Buat model Anda menunjuk ke object.property dan Anda akan baik-baik saja.
Pengendali
Templat
Ini terjadi ketika cakupan anak sedang dimainkan - seperti rute anak atau ng-pengulangan. Lingkup anak membuat nilainya sendiri dan konflik nama lahir seperti diilustrasikan di sini :
Lihat klip video ini untuk lebih banyak: https://www.youtube.com/watch?v=SBwoFkRjZvE&t=3m15s
sumber
Dalam Menguasai Pengembangan Aplikasi Web dengan AngularJS buku hal.19, tertulis bahwa
Lingkup hanyalah objek JavaScript, dan mereka meniru hierarki dom. Menurut JavaScript Prototype Inheritance , properti lingkup dipisahkan melalui cakupan. Untuk menghindari hal ini, notasi titik harus digunakan untuk mengikat model-ng.
sumber
Menggunakan
this
alih-alih$scope
bekerja.Sunting: Pada saat menulis jawaban ini, saya memiliki situasi yang jauh lebih rumit daripada ini. Setelah komentar, saya mencoba mereproduksi untuk memahami mengapa itu berhasil, tetapi tidak berhasil. Saya pikir entah bagaimana (tidak benar-benar tahu mengapa) lingkup anak baru dihasilkan dan
this
mengacu pada lingkup itu. Tetapi jika$scope
digunakan, itu sebenarnya merujuk ke parent $ scope karena lingkup leksikal javascript fitur .Akan lebih bagus jika seseorang yang memiliki masalah ini menguji cara ini dan memberi tahu kami.
sumber
$scope
membuat ruang lingkup baru (yaitu dalam fungsicheck()
,this
merujuk ke ruang lingkup yang merupakan ruang lingkup anak$scope
). Kenapa gitu? Bisakah Anda memberi penjelasan?this.searchText = "something else"
atau bahkan jika$scope.searchText = "something else"
, itu tidak memperbarui tampilan. dapatkah Anda menjelaskan masalah ini?Saya memiliki masalah yang sama dan itu karena saya tidak mendeklarasikan objek kosong terlebih dahulu di bagian atas controller saya:
Semoga ini akan bekerja untuk Anda!
sumber
Saya menemukan masalah yang sama ketika berhadapan dengan pandangan non-sepele (ada ruang bersarang). Dan akhirnya ditemukan bahwa ini adalah hal yang sulit diketahui ketika mengembangkan aplikasi AngularJS karena sifat dasar prototipe dari java-script. Lingkup bersarang AngularJS dibuat melalui mekanisme ini. Dan nilai yang dibuat dari ng-model ditempatkan di lingkup anak-anak, tidak mengatakan lingkup orang tua (mungkin yang disuntikkan ke controller) tidak akan melihat nilai, nilainya juga akan membayangi properti apa pun dengan nama yang sama yang didefinisikan dalam lingkup orang tua jika tidak menggunakan titik untuk menegakkan akses referensi prototipe. Untuk detail lebih lanjut, checkout video online khusus untuk menggambarkan masalah ini, http://egghead.io/video/angularjs-the-dot/ dan komentar yang menindaklanjutinya.
sumber
Lihatlah biola ini http://jsfiddle.net/ganarajpr/MSjqL/
Saya (saya berasumsi!) Telah melakukan persis apa yang Anda lakukan dan tampaknya berhasil. Bisakah Anda memeriksa apa yang tidak berfungsi di sini untuk Anda?
sumber
Karena tidak ada yang menyebutkan ini, masalahnya dapat diselesaikan dengan menambahkan
$parent
ke properti terikatDan pengontrolnya
sumber
Bagi saya masalahnya diselesaikan dengan menyimpan data saya menjadi sebuah objek (di sini "data").
Saya berharap ini akan membantu
sumber
Saya baru saja mengalami masalah ini menggunakan root_controller terikat ke elemen-tubuh. Kemudian saya menggunakan ng-view dengan router sudut. Masalahnya adalah SELALU sudut menciptakan ruang lingkup baru ketika menyisipkan html ke elemen ng-view. Sebagai konsekuensinya, fungsi "cek" saya didefinisikan pada lingkup induk dari lingkup yang dimodifikasi oleh elemen ng-model saya.
Untuk mengatasi masalah tersebut, gunakan saja pengontrol khusus di dalam konten html yang dimuat rute.
sumber
Anda dapat melakukannya untuk mengaktifkan pencarian di
ng-keypress
enter untuk input teks dan ding-click
untuk ikon:sumber
Saya memiliki masalah yang sama.
Cara yang tepat adalah mengatur 'searchText' menjadi properti di dalam objek.
Tetapi bagaimana jika saya ingin membiarkannya seperti itu, sebuah string? baik, saya mencoba setiap metode yang disebutkan di sini, tidak ada yang berhasil.
Tapi kemudian saya perhatikan bahwa masalahnya hanya di inisiasi, jadi saya baru saja menetapkan atribut nilai dan itu berhasil.
Dengan cara ini nilai hanya disetel ke nilai '$ scope.searchText' dan diperbarui ketika nilai input berubah.
Saya tahu ini solusinya, tapi itu berhasil untuk saya ..
sumber
Saya menghadapi masalah yang sama ... Resolusi yang berhasil bagi saya adalah menggunakan kata kunci ini ..........
lansiran (this.ModelName);
sumber