JavaScript prototype error: caught TypeError - attempting to call undefined function

I am facing challenges while attempting to create a Factory in AngularJS. I have moved the code from the controller to the factory and made a few adjustments for it to function properly.

Here is the error that I am encountering:

"El objeto no acepta la propiedad o el método 'addPoint'" (in IE) ("Object does not support property or method 'addPoint'")

"Uncaught TypeError: undefined is not a function" (in Chrome)

Below is my code snippet:

function Shape(shape) {
  this.ToolName   = shape.tool;
  this.LineColor  = shape.lineColor;
  this.LineWidth  = shape.lineWidth;
  this.LineCap    = shape.lineCap;
  this.FillStyle  = shape.fillStyle;
  this.isFilled   = shape.filled;
  this.isStroked  = shape.stroked;
  this.Points     = [];
}

Shape.prototype.addPoint = function(point){
  if(this.ToolName!=='pencil' && this.Points.length>1){
    this.Points.pop();
  }
  this.Points.push(point);
};

This functionality used to work when it was placed inside the Controller, but now it is not functioning as expected within the factory.

Thank you.

EDIT:

I apologize for not providing more code. You can find the source code here: https://github.com/michaeljota/Arheados/blob/master/app/scripts/controllers/main.js

The code above pertains to the controller section. My objective is to convert everything that is not handled by $scope into a Factory. Someone suggested using a Service, but I am not fully familiar with how Services operate.

Thank you once again!

Answer №1

Thanks to Evan Knowles, I was able to spot the error in my code.

Previously, I forgot to give the shape to the constructor, only assigning tmpShape = shape; (which is the $scope model). After making the correction to tmpShape = new Shape(shape);, everything started working again.

I apologize for asking such a beginner question.

Thank you all!

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

Prepending a string to the key of a JSON object using JavaScript

Is there a way to add 'd:' before the key of a JSON object? Here is the JSON data: "data": { "aa": "value", "ab": "value" } The expected result should look like this: "d:data": ...

How to Retrieve Content from an iFrame Using jQuery?

I am facing a challenge with an HTML form that is directed to an IFRAME upon clicking "submit". The iframe then loads a page after the submission, which indicates whether the user-input data is valid or not. It simply displays on screen as "TRUE" or "FALSE ...

Ajax script causes error 403 when loading content while scrolling

Currently in the process of creating a blog using the HubSpot platform. The primary goal is to have blog posts load dynamically as users scroll down the page. I came across a script that claims to achieve this functionality and is designed specifically for ...

Starting over fresh after clearing the interval

Visit the test site Is there a way to reset the animation back to the beginning once it reaches the last image? I've attempted the code below, but it doesn't seem to bring it back to the first image. $(document).ready(function () { window. ...

Updating the $_GET parameter using JQuery when a button is clicked

I'm working on implementing a feature where a series of buttons can update the $_GET['year'] variable on my website. These buttons should function across different pages within my website, such as: example.com example.com/?search=foo exa ...

How can you utilize a previously opened window from another page in JavaScript?

One of my challenges involves managing windows in a JavaScript environment. When I open a child window using window.open("http://foobar","name"), it reuses the same window when opened with the same name, which is exactly what I want. However, if the origi ...

Is there a way to iterate through indexed variables in javascript?

After receiving an array of data from a JQuery .ajax function, I noticed that the fields in the array are named and numbered like part1, part2, part3, etc. I attempted to loop through this data using the code below, but unfortunately, it resulted in NaN: ...

Modify the PrimeFaces dialog to be modal using client-side code

One of my primefaces dialogs is set up like this: <p:dialog widgetVar="dlg" width="320" height="220" modal="false" closable="false" showHeader="false" resizable="false" position="right,top"> I am looking to make this dialog modal if a certain eleme ...

Efficient method to access two arrays simultaneously and combine them into an associative array in JavaScript

When using Ajax to return a table, you have the option of separating column names and row values. Here are two ways to do it: let columns = ["col1", "col2", "col3"]; let rows = [ ["row 1 col 1", "row 1 col 2", "row 1 col 3"] , ["row 2 col 1", "r ...

When a client sends a GET request to the server, an error occurs due to the absence of 'Access-Control-Allow-Origin' header in

I am encountering an issue with my node/express js application running on localhost while making a 'GET' request to Instagram's api. The error message I keep receiving is: XMLHttpRequest cannot load https://api.instagram.com/oauth/authorize ...

Typescript is throwing an error stating that the type 'Promise<void>' cannot be assigned to the type 'void | Destructor'

The text editor is displaying the following message: Error: Type 'Promise' is not compatible with type 'void | Destructor'. This error occurs when calling checkUserLoggedIn() within the useEffect hook. To resolve this, I tried defin ...

The Proper Method of Displaying Data from a JSON File Using AngularJS

I'm having trouble getting the data from a JSON file (click on the "Json File" link to view the structure). I'm not sure what to put after "$Scope.listOfRecipe=". I tried using response.data.recipes, but it's not working and causing errors. ...

Array not being updated and reset with submitted form information

Within my controller, there exists a straightforward array and function: $scope.newGuarantor = ''; $scope.guarantors = [ {guarantor: 'Peter Parker'}, {guarantor: 'Bruce Wayne'} ]; $scope.addGuarantor = function(){ ...

Modifying the default value setting in MUI Datepicker

Currently, I am utilizing version @mui/x-date-pickers ^6.17.0. Here is the custom date picker I am using: https://i.stack.imgur.com/k8nF1.png Upon clicking the input field, the placeholder switches and a value gets appended. However, modifying the input ...

Struggling to transmit Fullcalendar configurations via the directive in AngularJS?

I am attempting to use a basic example of the AngularJS Fullcalendar directive from this source: https://github.com/angular-ui/ui-calendar Despite following the instructions, no events are displayed and my custom FullCalendar settings are not applied. I a ...

Is it possible to send both props and a function within a single onClick event in React?

After spending hours searching for the right solution, I have yet to find it. Let me explain my situation clearly. I have an Image Carousel feature on my website that should open when a user clicks on an image. I have 5 images on the website, and when a us ...

Creating a large JSON file (4 GB) using Node.js

I am facing a challenge with handling a large json object (generated using the espree JavaScript parser, containing an array of objects). I have been trying to write it to a .json file, but every attempt fails due to memory allocation issues (even though m ...

Trying to bring in components from directories above

I'm currently facing an issue with importing components from a parent directory into my project. My goal is to be able to use these components across multiple projects, which seems like the most straightforward approach. However, when I attempt this, ...

Is it possible to showcase the data from three or more PHP files on a single webpage?

I currently have three PHP files: pie.php, bar.php, and line.php. When each file is run individually, it displays a webpage with a pie chart, bar chart, or line graph respectively. However, running all three files opens up separate webpages for each graph. ...

Is there a way to dynamically compute the height of rows in a VariableSizeList based on their index?

Is there a method to dynamically calculate the height of rows in React using the react-window library? Since it's uncertain whether all rows will have the same size, I find myself needing to utilize VariableSizeList. However, I'm wondering if the ...