Assigning values to AngularJS data on an ng-click event

I'm having trouble setting a variable's value within an ng-click function.

<a href="#newpage" ng-click="service.name='{{sub.cid}}'"> view</a>

However, when I use plain text instead of an Angular data value, it works perfectly fine.

<a href="#newpage" ng-click="service.name='abc'">

What could be the issue in my code?

Answer ā„–1

Replace string interpolation with the direct use of sub.cid

<a href="#newpage" ng-click="service.name=sub.cid"> view </a>

Answer ā„–2

Define a function to assign values and separate logic from the template

<a href="#newpage" ng-click="updateValue(sub.id)"> view</a>
<a href="#newpage" ng-click="updateValue('xyz')"> view</a>

function updateValue(newValue) {
  ctrl.service.title = newValue;
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

The tabPanel contents are not being displayed

As a newcomer to the sencha touch framework, I've encountered a problem that I'm struggling to solve on my own. The issue arises when I try to create a TabPanel within a Panel - the content of the TabPanel does not display, only the toolbar with ...

What steps can be taken to fix the eslint error related to the <p> element with the message "Non-interactive elements should not be assigned interactive roles"?

I am currently working on implementing the following code, but I have been encountering challenges in making it keyboard accessible: <p className={styles['clear-text']} onClick={clearAllFilters}> {'Clear All'} </p ...

Zooming into mouse position within Three.js 3D Environment

Iā€™m facing an issue with my project that utilizes Three.js and orbitControls.js for handling the camera. The scene consists of a simple cube and the camera. By default, the camera zooms in/out towards the center of the screen when using the mouse wheel. ...

Dealing with Errors using Restangular

I'm struggling with retrieving a JSON object from my backend using Restangular. 1) Everything seems to be working fine, but I am unsure how to handle errors since there is no callback or promise function: meals = restAngular.all('meal').ge ...

Converting all HTML classes into a PDF document for export

I am attempting to export an HTML element with the class .content into merged PDF pages. I am utilizing the pdfMake library, which can be found at this link: pdfMake Within the body of the document, there are two elements with the class .content, styled a ...

How to prevent npm from being accessed through the command prompt

I recently began working on a ReactJs project. However, I am facing an issue where after starting npm in Command Prompt, I am unable to enter any text. Should I close the cmd window or is there a way to stop npm? You can now access your project at the fol ...

bridging information from tables with text fields in forms

I am working on an HTML/CSS page that utilizes a table layout filled with buttons to mimic a T9 keypad design. Within the page, I have a form containing two text fields. My aim is to populate these text fields with numbers based on the values from the tab ...

Using Firebase Cloud Functions to Automatically Increase Counters

Can a counter be incremented using a realtime database trigger and transaction? exports.incPostCount = functions.database.ref('/threadsMeta/{threadId}/posts') .onWrite(event => { admin.database().ref('/analytics/postCount') ...

How can I include 'res.addHeader("Access-Control-Allow-Origin", "*")' in an express js application?

I am currently using AngularJS and Cordova for the front-end of my app, and Express and Node.js for the backend which acts as the server. The client side is running on http://localhost:9000, while Express.js is running on http://localhost:3000. I am trying ...

What is the best way to add external javascript files to bookmarklets?

I have been developing a CDN for a collection of scripts that I created for my job. Previously, I had to distribute these scripts individually and each user would have to download and install them on their own computer. Now, I am transitioning them to an A ...

What is the proper way to utilize a variable within the translate3d function?

Currently, I am developing my portfolio and working on a function in JavaScript called translate3d(0,10px,0). My question is, how can I use a variable instead of hardcoding the value 10px? I attempted to use translate3d(0,a,0) where 'a' is a vari ...

Ways to transmit the array values via AJAX to PHP and validating if the script value has been assigned

I have a question about sending array values to PHP using an array <script> $('input.update').on('focus', function() { $(this).data('val', $(this).val()); }); function sendvalue() { // Array var postData = []; ...

The jQuery document.ready event fails to trigger when invoked after using ScriptManager.RegisterStartupScript in the code-behind

I am currently working with a filtered list of items utilizing a tool called Check out the screen for a visual example. In the user flow, after selecting to add another action, a fancybox popup is triggered displaying the next image: After the user adds ...

What is the best way to create a loop for an array that holds objects?

Having an array with multiple objects raises a question. var profile = [ {"MODE":"Comfort","MONDAY":"09:00:00","TUESDAY":"09:00:00","WEDNESDAY":"09:00:00", "THURSDAY":"09:00:00","FRIDAY":"09:00:00","SATURDAY":null,"SUNDAY":null}, {"MODE":"Eco" ...

What are the differences between Angular's dynamic templating using compile and template function?

I am familiar with the purpose of each item in: compile vs link(pre/post) vs controller Now, consider this simple code: HTML <body ng-controller="mainController"> {{ message }} <div otc-dynamic=""></div> </body> Cont ...

Encountering an issue with an Angular application: TypeError occurs when attempting to read property 'then' of undefined

I encountered an error while performing a post from my controller. function postDashboardsData (dataType, dateFrom, dateTo) { $scope[dataType + '_done'] = false; Api.post('rotations/' + vm.data[0]._id + '/dashboard&apo ...

Ways to display a specific element by its id while concealing others

I have a collection of items in a list, each with unique ids: <ul> <li id="item1">Item 1</li> <li id="item2">Item 2</li> <li id="item3">Item 3</li> </ul> <div class="item1">This is Item 1.</div> ...

Mapping objects in an array with Javascript

This code snippet is intended for a React Native Chat app. The structure of my data should look something like this: const chatData = [ { id: 1, name: 'John Doe', messages: [ {text: 'Hello', sentAt: 'time here' ...

The then() function in Node.js is triggered before the promise is fully resolved

I'm struggling to get my Promise function working as intended. Here's what I need to accomplish: I am receiving file names from stdout, splitting them into lines, and then copying them. Once the copy operation is complete, I want to initiate oth ...

Exporting SVG to image in Ionic is successful on Android devices, but the image gets cut off when viewed on

I am facing an issue with exporting an SVG as a base64 encoded image and sending it to the server for storage on Google Cloud Storage. The process works fine on Android and in browsers, but fails when attempted on a physical device running IOS. On IOS, t ...