NativeScript for Mobile App Development Data Binding and MVVM 2 — Questions and Answers
Question 1: In NativeScript Vue, which directive provides two-way data binding on input elements?
- v-model (Correct answer)
- v-bind
- v-data
- v-sync
Correct answer: v-model
v-model on TextField and other input components creates two-way binding between the input value and the Vue component's data property.
Question 2: What is the purpose of the `$` prefix in NativeScript data binding expressions?
- References the current item in a list binding (Correct answer)
- References global variables
- Accesses native platform APIs
- Denotes Angular service injection
Correct answer: References the current item in a list binding
In ListView item templates, `$value` references the current list item, and `$index` provides the item's index.
Question 3: How do you observe changes to an ObservableArray in NativeScript?
- Listen to the 'change' event on the ObservableArray instance (Correct answer)
- Use array.watch()
- Subscribe to an RxJS observable
- Use array.onUpdate()
Correct answer: Listen to the 'change' event on the ObservableArray instance
ObservableArray emits a 'change' event whenever items are added, removed, or changed, allowing the ListView to update automatically.
Question 4: What happens when you assign a plain JavaScript object (not Observable) as bindingContext?
- Initial values display but UI won't update when properties change (Correct answer)
- The app throws a runtime error
- NativeScript auto-wraps it in Observable
- Binding works exactly the same
Correct answer: Initial values display but UI won't update when properties change
Without Observable, there are no change notifications, so the UI shows initial values but does not react to property mutations.
Question 5: In NativeScript Angular, how do you emit an event from a child component to its parent?
- Use @Output() with EventEmitter (Correct answer)
- Use @Input() with a callback function
- Call parent.emit() directly
- Use the NativeScript Observable class
Correct answer: Use @Output() with EventEmitter
@Output() decorates an EventEmitter property on the child, and the parent listens with (eventName)='handler($event)' in the template.
Question 6: Which NativeScript class represents an array that notifies listeners of mutations?
- ObservableArray (Correct answer)
- ReactiveArray
- BindableArray
- LiveArray
Correct answer: ObservableArray
ObservableArray wraps a standard array and fires change events on push, pop, splice, and other mutating operations.
NativeScript for Mobile App Development Data Binding and MVVM 2
In NativeScript Vue, which directive provides two-way data binding on input elements?