Passing parameters to a controller method in AngularJS from a directive

Embarking on my Angular JS journey, I have begun creating custom directives for a project. As part of the task, I needed to generate an angular tree and found a code snippet on a plunkr sample by someone else. Although it is not originally my code, I tried to expand upon it.

My challenge lies in calling a controller method with arguments from the directive. Despite exploring solutions on stack overflow, I have been unable to resolve the issue I am currently facing. It appears that somewhere in the recursive calling, I have made a mistake that results in the controller method being called with an undefined argument. Below is the plnkr code I have been working with.

http://plnkr.co/edit/76iQdnLQyu4k9cn4eId5?p=preview

Your assistance with this matter would be greatly appreciated.

Thanks, veera

javascriptangularjs

Answer №1

To modify the template of the choiceTree directive, update the following:

getauditchildren="getchildren(choice.procID)"

Replace it with:

getauditchildren="getchildren({ currentNodeId: choice.procID })

Check out the demo: http://plnkr.co/edit/fuMCQ9kSWN6Itxzmehth?p=preview

Answer №2

Having multiple levels causes this to malfunction. It consistently provides the identifier for the initial level. Check out this example link

updatechildren="updateauditchildren(currentNodeId)" //do we need to modify this?

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

Utilizing jQuery event delegation with the use of .on and the unique reference of (

Questioning the reference in a delegated .on event: Example: $('#foo').on('click', $('.bar'), function() { console.log(this); }); In this scenario, `this` will point to #foo. How can I access the specific bar element tha ...

javascriptjquery

A convenient way to implement a polyfill for the Object.create method in JavaScript using

A new way to implement the polyfill for javascript Object.create() has left me puzzled. You can find the code here. if (typeof Object.create != 'function') { // Implementation steps based on ECMA-262, Edition 5, 15.2.3.5 // Reference: ...

javascriptclosurespolyfillsiife

Utilizing template caching with uibmodal

After spending some time working on my application to make it functional offline, I have successfully cached my templates using $http and templateCache. However, I am facing an issue with $uibmodal that I can't seem to solve in an elegant manner. I ha ...

angularjsbootstrap-modalangular-templatecache

Trouble assigning the 'data' attribute to the 'Object' tag using jQuery. [Limited to IE8]

I have encountered a problem when creating an object element dynamically in jQuery to display some content. The code functions perfectly in all browsers except for IE8. Here is the code snippet: j$(document).ready(function(){ j$('.ob ...

javascriptjqueryhtmlinternet-explorerinternet-explorer-8

Data merging in Firebase 9 and Vue 3 is not functioning properly

I am facing an issue with merging data in my firebase database. I consulted the documentation at https://firebase.google.com/docs/firestore/manage-data/add-data for guidance. After attempting to merge data using setDoc, I encountered an error (Uncaught Ty ...

javascriptfirebasevue.jsgoogle-cloud-platformgoogle-cloud-firestore

Transmitting a jQuery array from the client to the server using AJAX in

I've looked at so many posts about this issue, but I still can't get my code to work. My goal is to retrieve a PHP array of values from the checkboxes that are checked. Here is my code snippet: <!doctype html> <html> <head> & ...

javascriptphpjqueryarraysajax

Looking for advice on using the ternary operator in your code? Let us

In my JS file, the code $scope.button = id ? "Edit" : "Add"; is functioning correctly. I am trying to implement it in the View like this: <button name="saveBtn" class="btn btn-primary" tabindex="10">{{person.id ? 'Edit' : 'Add&ap ...

javascriptangularjs

Whenever I try to include something within the `componentWillUnmount` function,

I'm currently learning React on my own. I've been trying to save session data in my componentWillUnmount method. However, when I add code inside componentWillUnmount, nothing seems to happen. I tried debugging by adding console logs and debugger ...

javascripthtmlreactjsreduxmaterial-ui

Enhance the sent server parameters by including extra options in fineuploader

I have successfully implemented file uploads using . Everything works perfectly. I am able to set parameters in the request object to send additional data to the server. However, when I try to add another parameter dynamically using the setParams function ...

javascriptjqueryfile-uploadfine-uploader

Tips on maintaining a constant number of elements displayed within a container while scrolling using *ngFor

In an effort to improve the performance of loading a large amount of data inside a container div, I implemented a solution. It initially worked fine, but as I continued to append elements to the list while scrolling down, it started to slow down significan ...

javascriptangular

Stopping the sound when its' Div is hovered over

I've managed to successfully trigger the audio to play on hover, but I'm having trouble getting it to pause when my mouse leaves the area. Check out the code in action here: https://jsfiddle.net/jzhang172/nLm9bxnw/1/ $(document).ready(functio ...

javascriptjqueryhtmlcss

Unable to save a string value from a function to MongoDB is unsuccessful

I've hit a roadblock. Working tirelessly to solve a persistent bug, but it feels like I'm getting nowhere. What am I missing? My goal is clear - once the user submits a form with the enctype of "multipart/form-data", I want to extract t ...

javascriptnode.jsexpressmongoosemulter

Issue with formik onchange event not filling data in Material UI TEXTFIELD component

Greetings! I am currently working on a React project where I am managing the authentication process. I am using Material UI and Formik for validation and handling input changes. However, I encountered an issue with my onchange Formik handler in the TEXTF ...

javascriptreactjsapimaterial-uiformik

Ways to restrict the input of only a single value when writing data using Firebase security guidelines

I'm feeling a little lost when it comes to understanding Firebase security rules - specifically about the concept of working from the top-down according to the documentation. Here is the rule that's causing me some confusion: "rules": { " ...

angularjsfirebasefirebase-security

Conceal when dates align

In my events list, I have dates displayed and would like to hide any end dates that are the same as the start dates. For instance; <span class="start_date">Wed 23rd January</span> <span class="end_date">Wed 23rd January</span> I ...

javascriptjquerydate

Trouble with CSS and JS tabs not activating when clicked?

I am experiencing issues with a navigation (organized in tabs) that is not functioning on this page, but it works correctly on this page using the same method for inclusion. When clicking "Norway" on the top left, the navigation opens but switching to the ...

javascripthtmlcss

ui-bootstrap pagination integrated with search functionality

After conducting thorough research and studying various examples, I successfully implemented pagination with a filter function. As someone new to Angular, I could really use your expertise to determine if this application is free of bugs or logical errors ...

angularjs

Is there a way to transform a Phaser 3 game into an android-game application?

As someone who is new to Phaser, I am curious about the possibility of converting a Phaser game into an Android game. Currently, I am utilizing Phaser with NPM for my projects. Any insights or advice on this matter would be greatly appreciated. Thank you! ...

javascriptnpmapkphaser-framework

Exploring the functionality of the MediaPicker property editor within a custom property in Umbraco

I am currently working on a custom property editor that utilizes the media picker. My controller code is as follows: angular.module("umbraco").controller("My.MediaCropperController", function($scope, dialogService) { $scope.mediaPicker = { ...

angularjspropertieseditorumbracomedia

Retrieving JSON information using Angular from JSONPlaceholder

Obtaining the JSON data from http://jsonplaceholder.typicode.com/ using Angular seems quite simple, yet I am struggling to find the right method. Can anyone provide guidance on how to achieve this? I have already attempted multiple approaches with no suc ...

angularjsjson