AngularJS not responding to double quotes in encoded format

I'm utilizing ngInit to transfer variables from PHP to my Angular JS Controller. Sometimes, the passed string may include encoded '"' (Double quotes ")

<div data-ng-controller="UserController" data-ng-init='init({"test":"&quot;My Test Input&quot;"})'>
</div>

However, when this occurs, I encounter the following error in Angular JS: http://errors.angularjs.org/1.3.13/$parse/syntax?p0=My&p1=is%20unexpected%2C%20expecting%20%5B%7D%5D&p2=16&p3=init(%7B%22test%22%3A%22%22My%20Test%20Input%22%22%7D)&p4=My%20Test%20Input%22%22%7D)

Seeking assistance, please

javascriptangularjsangularjs-directive

Answer №1

Experiment with 

<div data-ng-controller="UserController" data-ng-init='init({"experiment":"\"My Experiment Input\""})'>

Answer №2

It is not recommended to use ng-init in this context; it's better to run your code in a controller instead.

According to the documentation:

ngInit should only be used for aliased special properties of ngRepeat, as demonstrated in the example below. In all other cases, it is advised to utilize controllers for initializing values on a scope.

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

Generating a dynamic array of ngGrids following the completion of page loading

Currently, I am facing a challenge with my Angular application. I import a spreadsheet into the app, perform some JavaScript operations, and aim to display a variable number of tabs, each containing an ngGrid based on the data from the spreadsheet. This re ...

angularjs

Is it possible to integrate both redux and graphql with apollo client within a single react application?

Currently, I am immersed in a project where I am utilizing apollo/client and graphql within a React environment. To manage the global state, I've opted for redux as I anticipate handling a considerable amount of data in the project. My main query revo ...

javascriptreactjsreduxgraphql

Javascript: Accessing a shared variable within the class

Embarking on my JavaScript programming journey filled me with optimism, but today I encountered a challenge that has left me stumped. Within my tutorial project, there exists a class named Model which contains both private and public variables. Of particu ...

javascriptoopclass

Jump to Anchor when Page Reloads

Hey there! I'm currently developing a gallery script and I'm trying to figure out how to automatically position the page to the top of a specific anchor when it is loaded. I attempted to use the following code: <script>location.href = "#tr ...

javascriptjqueryhtml

Struggling to dynamically append additional textboxes to a <div> element using JavaScript

After spending over 12 hours on this problem, I am completely stuck and frustrated. I have tried countless variations and sought out other solutions to no avail. It should be a simple task. My project involves using JQueryMobile 1.2 along with its dependen ...

javascriptjqueryhtmljquery-mobile

After attempting to publish my NPM package, I encountered an issue where I received an empty object. This occurred despite utilizing a setup that includes ES6, Babel,

Is there anyone out there who can assist me with this issue? I am attempting to publish an npm package with the following configuration: webpack: production: { entry: [ './src', './src/app.scss', 'draft- ...

javascriptnpmecmascript-6webpackbabeljs

Ways to invoke external jQuery functions within Angular applications

In the midst of working on an Angular CLI Project, I find myself needing to incorporate some jQuery functionalities. To accomplish this task, I have added the necessary JavaScript files in the angular.json configuration: "scripts": [ "node_modules/jq ...

javascriptjqueryangularangular5

Why are users not visible in the Node.js application?

Good day! I am a newcomer to this community and I'm hoping to get some guidance in the right direction with my inquiries. Recently, I came across some code on Github that I am trying to improve upon. The code can be found at https://github.com/voroni ...

javascriptjquerynode.jssocket.io

Postman is showing an error when making a request using Express.js app.get()

Recently, I started working with Express.js and I am using Postman to test my API. When running the code below, I successfully retrieve all members from the object: // gets all members app.get('/api/members', (req, res) => { res.json(membe ...

javascriptexpress

Explanation requested for previous response about returning ajax data to the parent function

After coming across a helpful answer in the question titled How do I return the response from an asynchronous call?, I attempted to implement it without success. Reviewing Hemant Bavle's answer (currently with 62 votes) gave me hope, but my implement ...

javascriptjqueryajax

A guide on displaying JSON response data in Angular JS with the help of ng-repeat

I am attempting to display the values of a specific JSON in the correct order. Here is how my JSON is structured : { "A":[{"id":"21","name":"Andrea"},{"id":"22","name":"Apple"}], "B":[{"id":"21","name":"Baby"},{"id":"22","name":"Bali"}], "C":[{"id":"21"," ...

javascriptjsonangularjs

tips and tricks for adding content to json with the help of jquery/javascript

Is it possible to include text in a JSON array using jQuery or Javascript? Assuming that there is data in the following format: A list of numerical codes stored in a text file as 123, 456, 789 I am looking to convert them into a JSON array using JavaScr ...

javascriptjqueryjson

Show informational pop-up when hovering over selected option

My goal is to create an information box that appears when a user hovers over a select option. For example: <select id = "sel"> <option value="sick leave">Sick leave</option> <option value="urgent leave">Urgent lea ...

javascriptjqueryhtmlajax

Is there a way to trigger an angular function from an Android button when it is clicked?

Trying to incorporate an angular function into an Android application using webView.LoadUrl. The Android activity code being used is as follows: webView = (WebView) findViewById(R.id.webView1); webView.getSettings().setJavaScriptEnabled(true); webVi ...

androidangularjswebview

Emberjs: Developing a self-focusing button with Views/Handlebar Helpers

Currently, I am using a Handlebars helper view that utilizes Em.Button (although it's deprecated) to create a Deactivate Button. This button is designed to focus on itself when it appears and clicking it triggers the 'delete' action. Additio ...

javascriptjqueryviewember.jshandlebars.js

What is the best way to implement dynamic generation of Form::date() in Laravel 8?

Is there a way to dynamically generate the Form::date() based on the selection of 1? If 1 is selected, then display the Form::date() under the Form::select(). However, if 0 is selected, then hide the Form::date() in this particular view. For example: Sel ...

javascriptphphtmlajaxlaravel-8

Tips for incorporating a visible marker beside the dropdown arrow

When developing my React application with React hooks forms, I have a select component where I need to include a clear indicator 'x' icon next to the dropdown icon. The current select component code is: <Form.Control size="sm" as=&q ...

javascriptreactjsselectreact-hook-form

Encountering a 404 error in Node.js code that utilizes Axios for making requests

Hey there, I am currently working on linking 2 server files using Node.js, express, and Axios to perform certain actions with a URL. Here is the structure of the link: FE Client [UI (VUE) -> PostService.js] -> BE Server [index.js -> posts ...

javascriptnode.jsvue.jsexpressaxios

Utilizing a file from external sources in WebPack 1.x beyond the webpack root directory

In my project structure, I have the following setup: Root Project1 package.json webpack.config Project2 package.json webpack.config Common file1.js I need to use file1.js in each project. The webpack v ...

javascriptreactjswebpack

TypeScript - Indexable Type

Here is an explanation of some interesting syntax examples: interface StringArray { [index: number]: string; } This code snippet defines a type called StringArray, specifying that when the array is indexed with a number, it will return a string. For e ...

javascripttypescriptduck-typing