DIsplay Category Name with ID

My Database:

Category: CategoryID, CategoryName

Product: ProductID, Name, Des, ProductCategoryID

Product Model:

public function Category(){
   return $this->belongsTo('App\Category','ProductID','CategoryID');
}

Category Model:

public function Product(){
  return $this->hasMany('App\Product','ProductCategoryID','ProductID');
}

My Controller:

public function danhsachsanpham(){

$sanpham = Product::all();
return view('admin/products/danhsach', ['sanpham'=> $sanpham]);

Views:

<table class="table table-striped table-bordered table-hover" id="dataTables-example">
            <thead>
                <tr align="center">
                    <th>ID</th>
                    <th>Name</th>
                    <th>Description</th>
                    <th>Category Name</th>
                </tr>
            </thead>
            <tbody>
            <?php foreach ($sanpham as $sp): ?>
                 <tr class="odd gradeX" align="center">
                    <td>{{$sp->ProductID}}</td>
                    <td>{{$sp->ProductName}}</td>
                    <td>{{$sp->ProductLongDesc}}</td>
                    <td>{{$sp->ProductCategoryID->CategoryName}}</td>
                </tr>
            <?php endforeach ?>
            </tbody>
        </table>

And I get an Error:

Trying to get property of non-object (View: C:\xampp\htdocs\banhang\resources\views\admin\products\danhsach.blade.php)